Как показать все строки в jqGrid?
jqGrid выставляет свойство rowNum где вы можете установить количество строк для отображения на каждой странице. Как настроить сетку для отображения ВСЕХ строк?
Прямо сейчас я просто устанавливаю rowNum что-то действительно высокое, как <%= int.MaxValue %> но мне интересно, есть ли лучший способ.
15 ответов
В последней версии jqGrid вы можете установить rowNum в -1, чтобы указывать сетке всегда отображать все строки:
rowNum: -1
Смотрите последнюю документацию jqGrid здесь.
В частности:
Устанавливает, сколько записей мы хотим просмотреть в сетке. Этот параметр передается в URL для использования подпрограммой сервера, получающей данные. Обратите внимание, что если вы установите для этого параметра значение 10 (т.е. получите 10 записей), а ваш сервер вернет 15, то будут загружены только 10 записей. Установите для этого параметра значение -1 (неограниченно), чтобы отключить эту проверку.
Обновить
К сожалению, это поведение было нарушено в jqGrid 3.6.3. Согласно этому посту от Тони:
Да, это правда. Причина в новом введенном свитке:1. В будущем мы исправим это поведение.
Поэтому разработчики jqGrid знают об этой проблеме и, по-видимому, планируют исправить ее в следующем выпуске. К сожалению, этот пост был более года назад...
В настоящее время я могу порекомендовать вам установить rowNum очень большое количество, чтобы имитировать поведение -1,
Вы также можете попробовать решение Whatispunk ниже использования rowNum: '', Тем не менее, я попробовал это на сетке, содержащей локальные данные (loadonce: true). При попытке сортировки строк все локальные данные сетки исчезнут. Так что это решение, похоже, не работает для сеток с локальными данными, если только этот дефект не был исправлен в более поздней версии jqGrid (я тестировал его на jqGrid 3.8.2). Если у вас есть отзывы, пожалуйста, оставьте комментарий ниже!
Обновление - 16 апреля 2014 г.
Согласно команде jqGrid, это теперь исправлено:
Я добавил поддержку, чтобы установить различные значения дисплея в поле выбора пейджера, включая -1 для всех.
Однако у меня не было возможности проверить исправление. Предположительно это изменение будет в следующей версии после jqGrid 4.6.0.
jqgrid (3.5 в любом случае), похоже, не имеет элегантного встроенного способа сделать это. Лучшее, что я нашел на данный момент, - это добавить что-то вроде следующего в ваши параметры сетки:
rowList:[10,20,30,100000000],
loadComplete: function() {
$("option[value=100000000]").text('All');
},
Где 100000000 - это произвольно большее число, чем максимальное количество строк, которое вы когда-либо будете возвращать, а строка option[value=] означает, что ваш пользовательский интерфейс выглядит немного лучше. Дженки, но у меня работает.
Это работает:
// Step1 - defines the rows
jqGridOptions.rowList =[10, 50, 100, 500, 'All'];
...
...
// Step2 - Change the 'All' to a meaningful value
loadComplete: function (data) {
$(".ui-pg-selbox option[value='All']").val(1000);
}
Если вы вообще не хотите использовать пейджинг, измените код на стороне сервера, чтобы он просто возвращал все строки. не используйте параметр строки вообще.
если вы хотите иметь список строк, но также можете показать все, сделайте что-то подобное в свойствах сетки
jQuery("#statement_mods").jqGrid({
rowList:['ALL',30,50,100,200]
});
а затем в коде серверной части убедитесь, что вы игнорируете параметр row, если GET['columns']='ALL'
Если вы установили разбиение на страницы на панели навигации, вы также можете получить доступ к общему количеству строк, записанных в правом нижнем углу сетки, а затем добавить к сгенерированной опции RowList.
Сделать что-то вроде:
// Get the total number of rows and delete space between numbers (Split the content of the div depending of the language (for me french)
var val=jQuery("#pager_right div").text().split('sur')[jQuery("#pager_right div").text().split('sur').length-1].split(' ').join('');
// And do the appending if the option isn't already added
if(!$(".ui-pg-selbox option[value='"+val+"']").length > 0)
jQuery(".ui-pg-selbox").append($('<option></option>').val(val).html(val));
У меня это работает:
$('#bla').jqGrid({
...
'rowNum' : 0,
'loadOnce' : true,
'loadComplete': function(data) {
$(this).jqGrid('setGridParam', 'rowNum', data.total);
},
...
});
Это работает с и без loadOnce опция установлена в true. Обратите внимание, что вы должны установить rowNum сначала выберите 0, если вы не включите эту опцию, она по умолчанию будет отображать 20 записей. Кроме того, я предполагаю, что вы возвращаете общее количество строк с сервера в задокументированном формате чтения JSON.
По умолчанию сетка JQ показывает максимум 20 строк, если вы не используете нумерацию страниц:
// To over come with this problem ,you can just write the bold mark
(rowNum:10000,):
$("#MasterDataDefinationGrid").jqGrid({
url: 'FetchData.aspx/GetDataFromDB',
datatype: 'json',
mtype: 'POST',
height: 300,
autowidth: true,
serializeGridData: function (postData) {
return JSON.stringify(postData);
},
ajaxGridOptions: { contentType: "application/json" },
loadonce: true,
colNames: [Your column names],
colModel: [Your model],
formatter: 'actions',
pager: '#MasterDataDefinationPager', pgbuttons: false,pgtext:false,
multiselect: false,
ignoreCase: true,
**rowNum: 10000,**
loadtext: 'Loading ...',
gridview: true,
hidegrid: false,
jsonReader: {
page: function (obj) { return 1; },
total: function (obj) { return 1; },
records: function (obj) { return obj.d.length; },
root: function (obj) { return obj.d; },
repeatitems: false,
id: "0"
},
caption: 'Data'
});
Разрешил это простым изменением: rowNum: inputDataArray.length
где inputDataArray - это массив, который я предоставляю в Grid.
Jqgrid.PagerSettings.PageSize = Max Row you want to display;
Jqgrid.ToolBarSettings.ToolBarPosition = ToolBarPosition.Hidden;
Параметр
Чтобы удалить это, я просто добавил параметр css display none, получая сектор в jquery. Как это
$('#id_tableCell').css('display', 'none');
Примечание. Эта настройка css должна быть выполнена после завершения загрузки сетки.
Вы также можете перейти в jquery.jqGrid.js и изменить "rowNum:20" на "rowNum:Some-Really-Large-Number". Когда вы определяете свой jqGrid, не указывайте rowNum. Затем верните весь набор данных обратно в jqGrid.
loadComplete: function (data) {
//set our "ALL" select option to the actual number of found records
$(".ui-pg-selbox option[value='ALL']").val(data.records);
}
Это изменяет параметр "ВСЕ" на фактическое количество записей в наборе данных.
Даже если в документе все еще отображается, что вы не можете установить значение rowNum в -1 с jqGrid 4.5.4, оно работает снова (возможно, и в более ранней версии).