2016-06-10 58 views
0

因为我第一次尝试Kendo Grid。我在前端有几行处于隐藏模式。但在分页中,即使隐藏的行也正在计数。 我们可以排除隐藏的行。或者只是对可见行进行分页。Kendo Grid - 仅可见行分页(排除隐藏行)

在此找不到更好的结果。

$('#grid').html(''); 
    var grid = $j("#grid").kendoGrid({   
     dataSource: dataSource, 
     columns: [ 
       { 
        field: "Active", 
        template: '<input type="checkbox" class="checkbox" ></input>', 
        headerTemplate: '<a class="k-link" href="#"><input type="checkbox" id="checkAll" class="k-link"/></a>', 
        width: 30, 
        sortable: false 
       }, 
       { field: "Id", title: "Id", width: 90 }, 
       { field: "Name", title: "Name", width: 125 }, 
       { field: "Program", title: "Program", width: 125 }, 
       { field: "Date", title: "Month", type: "date", template: "#= kendo.toString(kendo.parseDate(Date, 'MM-dd-yyyy'), 'dd MMM yyyy') #", width: 125 }, 
       ,attributes: { "class": "# if(Language === 'English') { # # } else {#rowhide#} #" }}], 
     pageable: { 
      change: function (e) { 
       var gridData = $j("#grid").data("kendoGrid")._data; 
       var selectedRowCount = 0; 
       $.each(gridData, function (index, currentData) { 
        var checkBoxRow = $("tr[data-uid='" + currentData.uid + "']"); 
        var checkBox = checkBoxRow.find('.checkbox'); 
        var isPresent = false; 
        for (var i = 0; i < selectedRows.length; i++) { 
         if (selectedRows[i] == currentData.StatementsHistoryId) { 
          isPresent = true; 
          break; 
         } 
        } 
        if (isPresent) { 
         checkBox[0].checked = true; 
         selectedRowCount += 1; 
        } 
        else { 
         checkBox[0].checked = false; 
        } 
       }); 
       if (selectedRowCount != 0 && gridData && gridData.length == selectedRowCount) 
        $('#checkAll').prop('checked', true); 
       else 
        $('#checkAll').prop('checked', false); 
      } 
     }, 
     editable: true, 
     sortable: true 

    }).data("kendoGrid").table.on("change", ".checkbox", selectRecord); 

这是我的代码..任何人都可以帮助我这个请。

回答

0

分页是基于数据源,你用CSS隐藏它们。 您应该在dataBound事件中移动隐藏条件,并将它们从数据源中删除。