2016-06-10 53 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事件中移動隱藏條件,並將它們從數據源中刪除。