Пагинация на Kendo UI Grid не работает

Я показываю сетку с удаленными данными, если я не добавляю разбиение на страницы, отображается полный набор данных, конечно, это нежелательно.

Ниже приведен код, который я использую для отображения данных в сетке:

var ds = new kendo.data.DataSource({
    transport: {
        read: {
            url: "http://127.0.0.1:81/SismosService.svc/usuario/index",
            dataType: "json"
        }
    },
    schema: {
        data: "Response"
    },
    pageSize: 5
});
$("#usuariosGrid").kendoGrid({
    pageable: {
        refresh: true
    },
    columns: [
        { field: "UsuarioId", title: "ID", width: "100px" },
        { field: "Nombre", title: "Nombre", width: "100px" },
        { field: "ApellidoP", title: "Apellido Paterno", width: "100px" },
        { field: "ApellidoM", title: "Apellido Materno", width: "100px" },
        { command: [{ text: "Editar", click: editFunction }, { text: "Eliminar", click: deleteFunction }], title: " ", width: "200px" }
    ],
    dataSource: ds
});

Это отображает сетку с 5 элементами на ней, но это все, я не могу перемещаться по остальным записям. Количество страниц и элементов для отображения помечено как ноль, отключая элементы управления навигацией.

Мне что-то не хватает в моей конфигурации? Спасибо за любую помощь, которую вы можете предоставить.


javascript kendo-grid kendo-ui
person Uriel Arvizu    schedule 11.02.2013    source источник

Ответы (3)


arrow_upward
6
arrow_downward

Когда пейджинг выполняется на сервере (проверьте serverpaging), вам необходимо вернуть общее количество записей. Дополнительную информацию см. В total.

person OnaBai    schedule 11.02.2013
comment
Я изменил свой код, чтобы он выглядел как this, количество страниц верное и кнопки навигации работают, но показывает все записи на одной странице все время. Я что-то еще упускаю? - person Uriel Arvizu; 12.02.2013
comment
При выполнении serverPaging сервер отвечает за разбиение на страницы, поэтому он должен отправлять только pageSize записей. Ваш сервер возвращает только количество записей, указанное в pageSize? - person OnaBai; 13.02.2013
comment
Я думаю, что я что-то неправильно истолковал, я думал, что pageSize имел в виду количество записей на страницу, отображаемую в сетке. Я думал, что если сервер вернул 20 записей, а pageSize, определенный в источнике данных, был равен 5, то я бы отобразил 4 страницы по 5 записей в каждой сетке. Но из того, что вы мне рассказываете, я предполагаю, что pageSize - это параметр, отправляемый на сервер для возврата 2 страниц записей? В этом случае у моего сервера нет конечной точки, которая получает такой параметр. Если мой сервер возвращает n записей, как я могу отобразить эти записи на m страницах? - person Uriel Arvizu; 13.02.2013
comment
Если вы хотите отображать группы по 5 записей на странице, НО получая все данные с сервера, вы должны указать serverPaging на false. - person OnaBai; 13.02.2013
comment
Хорошо, поэтому мне пришлось указать pageSize, итоговое значение и установить для serverPaging значение false. Теперь это работает. Спасибо. - person Uriel Arvizu; 13.02.2013
comment
Работает, когда я установил dataSource на .ServerOperation (false); - person Christopher Leach; 21.08.2013

arrow_upward
1
arrow_downward

У меня была такая же проблема, потому что я неправильно понял serverPaging. Если вы установите для serverPaging значение true, вам также необходимо изменить то, что возвращает сервер.

Раньше у меня был сервер, возвращающий все данные. Чтобы исправить это, я использовал ToDataSourceResult, чтобы изменить то, что возвращает мой сервер.

См .: Как реализовать разбиение на страницы на стороне сервера в сетке пользовательского интерфейса Kendo на стороне клиента в asp.net mvc

person Elaine Lin    schedule 16.07.2015

arrow_upward
0
arrow_downward

потратьте день на эту незначительную проблему, все, что вам нужно сделать, это вернуть общее количество записей, если ваша служба не возвращает общее количество записей, выполните следующие действия.

schema: {
        data: "Response"
    },

total: function(response)
      {
        return response."your method name".length;
      }
person user4339579    schedule 09.12.2014