如何从kendo网格中删除多个标题

时间:2017-11-15 06:58:35

标签: javascript jquery kendo-grid

我正在创建一个示例应用程序,其中我在kendo网格中显示数据。 为此,我在kendo网格中获取页面大小数据,然后加载它。当页面改变时我加载下一个数据。

当我的页面更改事件调用时,网格已添加到已存在的网格中。这样就显示了多列标题。

我的样本是 - http://jsfiddle.net/pporwal26/y6KdK/78/

var jsonData = JSON.parse("{\"Report\":\"type1\",\"FileList\":[{\"owner\":\"machine-174\\\\admin\",\"path\":\"C:\\\\workarea\\\\WinTest1lakhfileinKB\\\\WinTest\\\\nGYh\\\\SMv\\\\U1P8FLx\\\\vMbhdo\\\\TgFSW\\\\42Ioulj0w.txt\"},{\"owner\":\"machine-174admin\",\"path\":\"C:\\\\workarea\\\\bada_data\\\\Employee Database - Copy (7) - Copy.mdb\"}],\"Count\":100,\"total\":100,\"page\":4}");

function nextData(page){
jsonData = JSON.parse("{\"Report\":\"type1\",\"FileList\":[{\"owner\":\"machine-170\\\\admin\",\"path\":\"C:\\\\workarea\\\\WinTest1lakhfileinKB\\\\WinTest\\\\nGYh\\\\SMv\\\\U1P8FLx\"},{\"owner\":\"machine-170admin\",\"path\":\"C:\\\\workarea\"}],\"Count\":100,\"total\":100,\"page\":5}");
$("#grid").kendoGrid({  dataSource: {
       serverPaging: true,
       schema: {
           data: "FileList",
           total: "total" 
       },
       data: jsonData 
   } })
}

createGrid(jsonData);
function createGrid(jsonData){
$("#grid").kendoGrid({
   pageable: true,
   scrollable: true,

   pageable: {
         pageSize: 2,
         refresh: true,
         change:function(e){
           nextData(e.index);
         }
     },
   dataSource: {
       serverPaging: true,
       schema: {
           data: "FileList",
           total: "total",
       },
       data: jsonData 
   }
});
}

如何在页面更改事件调用时删除多个标题?

2 个答案:

答案 0 :(得分:1)

尝试修改nextData函数,如下所示。

function nextData(page){
    jsonData = JSON.parse("{\"Report\":\"type1\",\"FileList\":[{\"owner\":\"machine-170\\\\admin\",\"path\":\"C:\\\\workarea\\\\WinTest1lakhfileinKB\\\\WinTest\\\\nGYh\\\\SMv\\\\U1P8FLx\"},{\"owner\":\"machine-170admin\",\"path\":\"C:\\\\workarea\"}],\"Count\":100,\"total\":100,\"page\":5}");
    var _dataSource = new kendo.data.DataSource({
       schema: {
           data: "FileList",
           total: "total"
       },
       data: jsonData,
       serverPaging : true,
       pageSize : 2,
       page     : page
    });
    $("#grid").data("kendoGrid").setDataSource(_dataSource);
}

答案 1 :(得分:0)

http://jsfiddle.net/y6KdK/79/

var grid = createGrid(jsonData);

创建网格实例。

var dataSource = new kendo.data.DataSource({
  data: jsonData
});
grid.setDataSource(dataSource);

并将新创建的数据源设置为nextData函数。请看上面的小提琴链接。