Вот как структурированы мои данные:
[
{
"email": "[email protected]",
"name": "ww",
"password": "qLfsebHMKv7dNgExtR",
"active": false,
"role": "admin",
"createdAt": "2013-10-22T11:48:32.719Z",
"updatedAt": "2013-10-22T11:48:32.719Z",
"id": "52666610a6a311308b000001"
},
{
"email": "[email protected]",
"name": "QQ",
"password": "twfubGHoQkYDVup",
"active": true,
"role": "expert",
"createdAt": "2013-10-22T11:38:47.578Z",
"updatedAt": "2013-10-22T11:38:47.578Z",
"id": "526663c788101c9f89000001"
}
]
и это мой js:
$(function () {
$('#list').jqGrid({
url: '/api/v1/users',
datatype: 'json',
mtype: 'GET',
colNames: ['id','email','name', 'password', 'active','role','createdAt','updatedAt'],
colModel: [
{ name: 'id', width: 80 },
{ name: 'email', width: 80 },
{ name: 'name', width: 80, align: 'right' },
{ name: 'password', width: 80, align: 'right' },
{ name: 'active', width: 80, align: 'right' },
{ name: 'role', width: 80, align: 'right' },
{ name: 'createdAt', width: 80, align: 'right' },
{ name: 'updatedAt', width: 80, sortable: false }
],
jsonReader: {
repeatitems: false,
id: "id",
root: function (obj) { return obj; },
page: function (obj) { return 1; },
total: function (obj) { return 1; },
records: function (obj) { return obj.length; }
},
pager: '#pager',
rowNum: 10,
rowList: [10, 20, 30],
sortname: 'invid',
sortorder: 'desc',
viewrecords: true,
gridview: true,
autoencode: true,
caption: 'My first grid'
});
});
Я не мог заставить это работать вообще, еще хуже, чтобы отключить всю страницу !. Что мне здесь не хватает?
Обновление 1: Я добавил:
loadComplete: function (data) {
console.log("OK");
console.log(data);
},
loadError: function (jqXHR, textStatus, errorThrown) {
console.log('HTTP status code: ' + jqXHR.status + 'n' +
'textStatus: ' + textStatus + 'n' +
'errorThrown: ' + errorThrown);
console.log('HTTP message body (jqXHR.responseText): ' + 'n' + jqXHR.responseText);
}
loadComplete всегда возвращает OK, однако данные представляют собой пустой массив [].
Обновление 2: я проверил запрос jqGrid, и он сообщает, что он добавляет это в мой API:
/api/v1/users?_search=false&nd=1384254700817&rows=20&page=1&sidx=&sord=asc
Когда я нажимаю этот URL-адрес, он возвращает этот массив empaty. Любая идея, как изменить это поведение?
Отключение страницы при загрузке/загрузке Grid означает, что есть некоторая проблема CSS.
Сначала проверьте, добавили ли вы ui.jqgrid.css. Блокировка может произойти в случае, если не включить его.
Можете ли вы ударить URL?
Другая ошибка в вашей сетке: Sortname
. вы указали " invid'
который является недопустимым именем столбца в соответствии с вашей моделью столбцов.
Итак, исправьте это. Если вы используете последнюю версию Jqgrid. Нет необходимости включать следующий код:
jsonReader: {
repeatitems: false,
id: "id",
root: function (obj) { return obj; },
page: function (obj) { return 1; },
total: function (obj) { return 1; },
records: function (obj) { return obj.length; }
},
Вы можете просто игнорировать код выше. Jqgrid позаботится об этом.
Если вам нужно сортировать пользователей и подкачку, вам нужно LoadOnce:true
.
Это сделает ваши данные сетки локальными, а также сортировкой и подкачкой.
Если вы не указываете, вам необходимо позаботиться о сортировке, фильтрации и пейджинге.
Hopw это помогает...
**UPdated:**
[
{
"email": "[email protected]",
"name": "ww",
"password": "qLfsebHMKv7dNgExtR",
"active": "false",
"role": "admin",
"createdAt": "2013-10-22T11:48:32.719Z",
"updatedAt": "2013-10-22T11:48:32.719Z",
"id": "52666610a6a311308b000001"
},
{
"email": "[email protected]",
"name": "QQ",
"password": "twfubGHoQkYDVup",
"active":"true",
"role": "expert",
"createdAt": "2013-10-22T11:38:47.578Z",
"updatedAt": "2013-10-22T11:38:47.578Z",
"id": "526663c788101c9f89000001"
}
]