2012-12-04 58 views
2

我想剑道UI出来,我使用规定的学习目的的例子。假设我正在使用数十万个元素的大型数据源。如果我使用分页和页面大小为10,我真的希望能够从网页中只能获得10个元素,如果Kendo UI能够知道实际上元素的数量要大得多,但我们只显示10大数据剑道UI定格

这是我目前有:

 var initGrid = true; 
     var grid2Data; 

     function getDataSource() 
     { 
      return grid2Data.Data; 
     } 

     var grid; 
     function getPageIndex() 
     { 
      if (!(grid)) { 
       return 0; 
      } 
      return grid.pager.page() - 1; 
     } 

     function getPageSize() { 
      if (!(grid)) { 
       return 10; 
      } 
      return grid.pager.pageSize(); 
     } 

     function getFilters() { 
      if (!(grid)) { 
       return ""; 
      } 
      return grid.dataSource.filter(); 
     } 

     function getSorts() { 
      if (!(grid)) { 
       return ""; 
      } 
      return grid.dataSource.sort(); 
     } 

     function getParams() { 
      return getPageSize(); 
     } 

     function postTest() { 
      if (initGrid) { 
       $.post('myurl' + getParams(), function (data) { 
        grid2Data = data; 
        $("#grid").kendoGrid({ 
         dataBound: onDataBound, 
         dataSource: { 
          data: getDataSource(), 
          schema: { 
           model: { 
            fields: { 
             Email: { type: "string" }, 
             FullName: { type: "string" }, 
             LogCreateDate: { type: "date" }, 
             RoleName: { type: "string" }, 
             UserName: { type: "string" } 
            } 
           } 
          }, 
          pageSize: 10 
         }, 
         height: 300, 
         scrollable: false, 
         sortable: true, 
         filterable: true, 
         pageable: { 
          input: true, 
          numeric: false 
         }, 
         columns: [ 
         { 
          field: "Email", 
          title: "Email", 
          width: 100 
         }, 
         { 
          field: "FullName", 
          title: "Full Name", 
          width: 100 
         }, 
         { 
          field: "LogCreateDate", 
          title: "Created", 
          template: '#= kendo.toString(LogCreateDate,"MM/dd/yyyy") #' 
         }, 
         { 
          field: "RoleName", 
          title: "Role", 
          width: 50 
         }, 
         { 
          field: "UserName", 
          width: 100 
         } 
        ] 
        }); 
        grid = $("#grid").data("kendoGrid"); 
       }); 
      } 
      else { 
      } 
      initGrid = false; 
     } 

     $(document).ready(function() { 
      postTest(); 
     }); 

我的问题是,网格显示,这是件1-10从10,它的第一页。我希望网格向我展示由我给出的页面索引和项目数量。我如何设置网格的元素数量和页面索引?这可能吗?谢谢。

回答

5

当您在DataSource中通过将serverPaging设置为true来选择serverPaging时。你是在页码(page),页面大小(pageSize),记录数跳过(skip)......(寻找在http://docs.kendoui.com/api/framework/datasource serverPaging)和交换,你应该回到不仅与阵列的服务器信息接收器该页面的数据还包括总行数。然后你在schema.total中实现访问记录数的功能。即让我们假设你回来作为导致以下对象:从服务器接收

schema: { 
    total: function (response) { 
     return response.totalRows; 
    } 
} 

哪里response是对象:

{ 
    rows: [ 
     { id: 1, col1: "col1.1", col2: "col1.2" }, 
     { id: 2, col1: "col2.1", col2: "col2.2" }, 
     { id: 3, col1: "col3.1", col2: "col3.2" } 
    ], 
    totalRows : 1000 
} 

这时,你可能schema.total作为实施。

注:其实在这种情况下就足以定义schema为:

schema: { 
    total: "totalRows"; 
    } 
} 

由于total直接存储在totalRows领域。

检查http://demos.kendoui.com/web/grid/remote-data.html为例。

+0

谢谢你,优秀的答案。 –