Question

我在我的MVC项目中使用数据表进行排序和分页。因此分页和排序工作正常。

现在的问题是 -

我已为数据表显示pagesize:5。它每页显示5行，但不显示pagenumbers。如何使用kendo数据源显示分页，以显示下一页数的下5个数据行。

看看我的代码 -

 var template = kendo.template($("#template").html());

    // To Do Item Data
    // ---------------



    // Build the data source for the items
    var dataSource = new kendo.data.DataSource(
    { transport: {
        read: "/Task/Read"
    }, schema: {
        data: "Data"
    },
    serverGrouping: true,
    sort: { field: "TaskID", dir: "asc" },
    serverPaging: true,
    pageSize: 5 
});

    // When the data source changes, render the items
    dataSource.bind("change", function (e) {
        //alert('Bind');
        var html = kendo.render(template, this.view());
        $("#todos tbody").html(html);
    });

    // Initial read of the items in to the data source

    dataSource.read();




</script>

HTML CODE -

  <tr>
      <td> 
          <input type="checkbox" class="done" data-id="#= TaskID #" ></input>
      </td>
      <td>
          #= TaskID #
      </td>
      <td>
        #= Subject #
      </td>
      <td>
      #=AssignedTo#
      </td>
  </tr>
</script>
<div class="row-fluid">
<div class="span4"> <table id="todos" class="table table-striped table-bordered">
      <thead>
        <tr>
          <th>Done</th>
          <th>ID</th>
          <th>Task</th>
          <th>Assign To</th>
        </tr>
      </thead>
      <tbody>

      </tbody>

    </table></div>
</div>

请告诉我如何显示用于显示休息行的页码。我已经从kendo UI Grid迁移到kendo数据源并使用bootstrap进行样式化。

Answer 1

试试这个：将“** pageable：true **”添加到数据源外的kendo网格配置中，如：

$("#grid").kendoGrid({
  scrollable: true,
  sortable: true,
 ** pageable: true,**

Answer 2

您可以使用Kendo UI寻呼机。有用的链接：

ListView分页演示（使用Kendo UI寻呼机实现）：http://demos.kendoui.com/web/listview/index.html

寻呼机API参考：http://docs.kendoui.com/api/web/pager

kendo数据源分页

2 个答案: