Я использую простой jqgrid, и я загружаю данные по запросу, когда прокручиваются до нижних огней. я хочу сохранить предыдущие загруженные данные (загруженную страницу) и загрузить новые данные на прокрутке (новая страница). Я не знаю, как сохранить предыдущие данные при прокрутке вниз, старые данные заменяются новыми, как я могу решить Это?
$Grid.jqGrid({
type:'POST',
datatype:'jsonstring',
datastr:data,
// url:data,
// datatype: 'json',
jsonReader:{
repeatitems:false,
root:"result",
total:function (obj) {
return obj.total;
},
records:"total"
},
direction:"rtl",
sortable:true,
colNames:[Dictionary.Statement().serial , Dictionary.Statement().date, Dictionary.Statement().time, Dictionary.Statement().credit, Dictionary.Statement().debit, Dictionary.Statement().balance, Dictionary.Statement().details, Dictionary.Statement().description, '', '', '', '', ''],
colModel:[
{ label:'serial', name:'serial', index:'serial', search:true, width:100, align:'center' },
{ label:'date', name:'date', index:'date', width:50, editable:true, jsonmap:"shamsiDate.date", align:'center' },
{ label:'time', name:'time', index:'time', width:50, editable:true, jsonmap:"shamsiDate.time", align:'center' },
{ label:'credit', name:'credit', index:'credit', width:150, align:'center', editable:true },
{ label:'debit', name:'debit', index:'debit', width:50, align:'right', editable:true },
{ label:'balance', name:'balance', width:50, search:true, align:"right", editable:true },
{ label:'details', name:'details', width:50, fixed:true, sortable:false, resize:false, align:"center", formatter:jqgridSetting.ShowRowDetailsCol },
{ label:'description', name:'description', index:'description', sortable:false, hidden:true, hidedlg:true },
{ label:'branchCode', name:'branchCode', hidden:true, hidedlg:true },
{ label:'branchName', name:'branchName', hidden:true, hidedlg:true },
{ label:'registrationNumber', name:'registrationNumber', hidden:true, hidedlg:true },
{ label:'agentBranchCode', name:'agentBranchCode', hidden:true, hidedlg:true },
{ label:'agentBranchName', name:'agentBranchName', hidden:true, hidedlg:true }
],
rowNum:50,
pager:'#StatementPager',
sortname:'date',
viewrecords:true,
sortorder:"desc",
caption:"صورت حساب",
gridview:true,
rownumbers:true,
shrinkToFit:true,
autowidth:true,
loadComplete:function () {
jqgridSetting.SetRowStyle();
},
subGrid:true,
subGridRowExpanded:function (subgrid_id, row_id) {
addRowData = $Grid.jqGrid('getRowData', row_id);
var html = '<span style=" direction: rtl;float: right;margin-right:10px">' + addRowData.description + '</span>';
$("#" + subgrid_id).append(html);
jqgridSetting.EditSubgrid();
},
gridComplete:function () {
var subGridHeader = $('.StatementGridWrapper').find('#StatementGrid_subgrid').children(':first');
if ($('span.ui-icon-plus', '#jqgh_StatementGrid_subgrid').length == 0) {
subGridHeader.append('<span class="ui-icon ui-icon-plus"></span>').css('margin', '-1px 2px 0px 0px');
$(subGridHeader.children('span.ui-icon-plus')[0]).click(function () {
jqgridSetting.ShowMoreInfo()
});
}
jqgridSetting.SetGridHeaderStyle('#StatementGrid_rn');
$('.ui-jqgrid-bdiv','#gview_StatementGrid').on('scroll', function (e) {
var $o = $(e.currentTarget);
if ($o[0].scrollHeight - $o.scrollTop() <= $o.outerHeight()) {
alert('scrolltobottom');
var totalRow = $Grid.jqGrid('getGridParam', 'reccount');
var formData = {
'offset':totalRow == 0 ? 0 : totalRow - 1,
'length':50,
'depositNumber':$("#depositNumber").val(),
'action ':$("#action").val(),
'fromDate':$("#fromDate").val(),
'toDate':$("#toDate").val(),
'fromTime':$("#toTime").val(),
'toTime':$("#fromTime").val()
}
jqgridSetting.PostFormData("/statement/search", formData, 'Statement.SetupStatementGrid', true);
}
});
}
});
$Grid.jqGrid('navGrid', '#StatementPager', { edit:false, add:false, del:false, search:false });
Я вижу много мелких проблем в вашем коде. Я бы рекомендовал вам использовать datatype:'json'
вместе с loadonce: true
вместо типа datatype:'jsonstring'
. Если у вас сотни строк, загрузка моих данных достаточно быстро. Таким образом, вы можете вернуться с сервера только по всем строкам. jqGrid отобразит первые 50 строк (потому что вы используете rowNum:50
), и пользователь может использовать локальный пейджинг данных, который, как правило, очень быстро.
Если у вас возникли проблемы с использованием типа datatype:'json'
и загрузка данных напрямую, вы должны добавить свой вопрос с точным ответом с сервера. Я лично использую Fiddler для отслеживания трафика HTTP между клиентом и сервером. Здесь вы найдете точные данные JSON. Типичная ошибка новичков - это дополнительное ручное преобразование данных (объекта) в строку JSON. В случае, когда строка JSON будет преобразована в JSON во второй раз платформой.NET. В случае, если вы видите скрытые кавычки в ответе сервера (\"
). Вероятно, у вас есть другая проблема, но для ее локализации нужно увидеть ответ сервера.
Если вам нужны дополнительные данные для сервера depositNumber
, action
, fromDate
, toDate
и т.д., Вы можете использовать postData
свойства которого определяются как функции (см. Ответ) для более подробной информации.
$('.ui-jqgrid-bdiv','#gview_StatementGrid').on('scroll', ...)
части вашего кода? Вы действительно используетеdatatype:'jsonstring', datastr:data
а неdatatype: 'json'
? Вы реализовали пейджинг на стороне сервера? Сколько данных может быть максимально загружено в jqGrid (50, 1000, 10000 или более)? Вероятно,datatype: 'json'
сloadonce: true
будет лучшим выбором для вас?