Kendo treelist Child节点问题

时间:2017-08-17 09:36:16

标签: javascript kendo-treelist

每当我从子节点取消更新过程时,子节点只与根节点合并,我在控制台中找不到错误,或者我找不到任何可疑的东西。但重新加载后,一切都变得正常了

$(document).ready(function () {


         var windowTemplate = kendo.template($("#windowTemplate").html());
                 var dataSource = new kendo.data.TreeListDataSource({

                    transport: {
                         read: {
                             url: "officeprofiletree",
                             type: 'POST',
                             dataType: "json"
                         },
                         update: {
                            url: "officeprofilenametree_update",
                            type: 'POST',
                            contentType :'application/json',
                             dataType: "json"

                         },
                         destroy: {
                             url: "officeprofilenametree_destroy",
                             type: 'POST',
                            contentType :'application/json',
                             dataType: "json"
                         }, 

                         parameterMap: function(options, operation) {

                             if (operation !== "read" && options.models)
                            { 
                            return JSON.stringify(options.models);
                            }  
                         }
                     },
                     batch: true,
                     sort: { field: "name", dir: "asc" },
                     schema: {
                         model: {
                             id: "officeProfileNMId",
                             parentId: "parentId",

                             fields: {
                                 officeProfileNMId: { type:"number" },
                                 parentId:{nullable:true,type:"number"},
                                 mobile:{ type:"string"},
                                  address:{type:"string"},
                                 phone: {type:"string"},

                             },
                         }
                     }

                 });
                 var window = $("#window").kendoWindow({
                     visible:false,
                    title: "Are you sure you want to delete this record?",
                     width: "450px",
                     height: "60px",
                 }).data("kendoWindow");


           var treelist = $("#treelist").kendoTreeList({


              dataSource: dataSource,
                 pageable: true,
                 dataBound: function (){
                     var tree = this;
                     var trs = this.tbody.find('tr').each(function(){
                       var item = tree.dataItem($(this));
                       if( item.parentId == null) {
                         $(this).find('.k-button,.k-button').hide();
                       }

                     });               
                   },

                     columns: [
                         { field: "name", title: "Name"},
                         { field: "mobile", title:"Mobile", format: "{0:c}", hidden: true },
                         { field: "address", title:"Address",hidden: true },
                         { field: "phone",title:"Phone" ,hidden: true },

                         { command: [
                             {name: "edit"},

                             {name: "Delete",  
                                 click: function(e){  
                                     e.preventDefault();
                                     var tr = $(e.target).closest("tr"); 
                                     var data = this.dataItem(tr); 
                                     window.content(windowTemplate(data)); 
                                     window.center().open();

                                     $("#yesButton").click(function(){
                                        treelist.dataSource.remove(data);
                                        treelist.dataSource.sync(); 
                                        window.close();
                                        reloading();
                                         })

                                     $("#noButton").click(function(){
                                         window.close();
                                     })
                                 }                              
                             }
                             ]}

                      ] ,
                      editable: {
                          mode: "popup",

                        },




                      }).data("kendoTreeList");
        });

顺便说一下,更新和删除工作正常,这是小提琴 https://jsfiddle.net/me09jLy7/2/

更新用:

每当我创建一个ranikannur的孩子时,每个根ranikannur给我3个同名的孩子,在我的数据库中只有一个孩子是ranikannur的父级,但是treelist会显示它作为每个父节点中的3个子节点,子节点数3来自总ranikannur父节点(此处树具有3个ranikannur父节点) 我想这就是这三个孩子?

1 个答案:

答案 0 :(得分:1)

你试试吧......

$(document).ready(function () {
         var windowTemplate = kendo.template($("#windowTemplate").html());
                 var dataSource = new kendo.data.TreeListDataSource({

                    transport: {
                         read: {
                             url: "officeprofiletree",
                             type: 'POST',
                             dataType: "json"
                         },
                         update: {
                            url: "officeprofilenametree_update",
                            type: 'POST',
                            contentType :'application/json',
                             dataType: "json"

                         },
                         destroy: {
                             url: "officeprofilenametree_destroy",
                             type: 'POST',
                            contentType :'application/json',
                             dataType: "json"
                         }, 

                         parameterMap: function(options, operation) {

                             if (operation !== "read" && options.models)
                            { 
                            return JSON.stringify(options.models);
                            }  
                         }
                     },
                     batch: true,
                     sort: { field: "name", dir: "asc" },
                     schema: {
                         model: {
                             id: "officeProfileNMId",
                             parentId: "parentId",

                             fields: {
                                 officeProfileNMId: { type:"number" },
                                 parentId:{nullable:true,type:"number"},
                                 mobile:{ type:"string"},
                                  address:{type:"string"},
                                 phone: {type:"string"},

                             },
                         }
                     }

                 });
                 var window = $("#window").kendoWindow({
                     visible:false,
                    title: "Are you sure you want to delete this record?",
                     width: "450px",
                     height: "60px",
                 }).data("kendoWindow");


           var treelist = $("#treelist").kendoTreeList({


              dataSource: dataSource,
                 pageable: true,
                 dataBound: function (){
                     var tree = this;
                     var trs = this.tbody.find('tr').each(function(){
                       var item = tree.dataItem($(this));
                       if( item.parentId == null) {
                         $(this).find('.k-button,.k-button').hide();
                       }

                     });               
                   },

                     columns: [
                         { field: "name", title: "Name"},
                         { field: "mobile", title:"Mobile", format: "{0:c}", hidden: true },
                         { field: "address", title:"Address",hidden: true },
                         { field: "phone",title:"Phone" ,hidden: true },

                         { command: [
                             {name: "edit"},

                             {name: "Delete",  
                                 click: function(e){  
                                     e.preventDefault();
                                     var tr = $(e.target).closest("tr"); 
                                     var data = this.dataItem(tr); 
                                     window.content(windowTemplate(data)); 
                                     window.center().open();

                                     $("#yesButton").click(function(){
                                        treelist.dataSource.remove(data);
                                        treelist.dataSource.sync(); 
                                        window.close();
                                        reloading();
                                         })

                                     $("#noButton").click(function(){
                                         window.close();
                                     })
                                 }                              
                             }
                             ]}

                      ] ,
                      editable: {
                          mode: "popup",

                        },




                      }).data("kendoTreeList");
        });