Question

我是Kendo Grid的初学者。我想在网格中按需加载数据，例如：

当用户向下滚动到10行时，我将页面大小设置为10 grid应该从数据库中检索下10行并显示它为了做到这一点，我将“scrollable：true”更改为“scrollable：{virtual：true}”。但这会禁用网格中的滚动。

$scope.source = new kendo.data.DataSource({
  batch: true,
  group: getDSGroup(),
  transport: {
    read: userSvc.getUserList,
    update: _dataUpdateItem
  },
  error: function(e) {
    ngDialog.openConfirm({
      template: 'httpErrorDialogId',
      className: 'ngdialog-theme-default',
      data: {
        'status': e.status,
        'message': e.errorThrown
      }
    });
  },
  schema: {
    parse: function(data) {
      $rootScope.$log.log("User list was fetched.");
      if ($rootScope.sysSettings.userMgr_serverPaging)
        return data;
      for (var i = 0; i < data.items.length; i++) {
        data.items[i].letter = data.items[i].lastName.substr(0, 1).toUpperCase();
        if (data.items[i].departmentName == null) data.items[i].departmentName = $rootScope.$translate.instant("Unassigned");
        if (data.items[i].userGroupName == null) data.items[i].userGroupName = $rootScope.$translate.instant("Unassigned");
      }
      return data;
    },
    model: {
      id: "id"
    },
    groups: "groups",
    total: "totalItems",
    data: "items"
  },
  filter: getDSFilter(),
  sort: getDSSort(),
  pageSize: $rootScope.sysSettings.userMgr_serverPaging ? 10 : 0,
  serverGrouping: $rootScope.sysSettings.userMgr_serverPaging,
  serverPaging: true,
  serverSorting: $rootScope.sysSettings.userMgr_serverPaging,
  serverFiltering: $rootScope.sysSettings.userMgr_serverPaging
});

$scope.userListOptions = {
  //sortable: true,
  groupable: true,
  selectable: false,
  //pageable: true,

  scrollable: {
    virtual: true
  },
  //dataBound: function() {
  //  this.expandRow(this.tbody.find("tr.k-master-row").first());
  //},
  columns: [{
    field: "firstName",
    template: kendo.template($("#tpl-UserItem").html())

  }, {
    field: "letter",
    hidden: true,
    groupHeaderTemplate: "#= value #"
  }]
};

$scope.isEndlessScroll = function() {
  return $rootScope.sysSettings.userMgr_serverPaging;
};

Answer 1

如果正在创建网格而不可见，则配置有点不同。

http://docs.kendoui.com/getting-started/web/grid/walkthrough#initializing-the-grid-inside-a-hidden-container

希望这个帮助

Kendo网格虚拟滚动损坏/不提取数据

1 个答案: