我正在使用jq网格并使用json数据作为数据源。 因为我正在整理和加载所有数据。分页仅在客户端。
使用了两个jqgrid属性loadComplete和gridComplete。
因此，在加载完成时，我们应用属性，即应用css类并删除一些类
loadComplete: function(data) {
var recs = $("#" + oThis.tableId).getGridParam("records");
if (recs === 0 || recs === null) {
$("#" + oThis.tableId).append('<div class="errordiv">No records found.</div>');
}
else {
$(".errordiv").hide();
oThis.adFlexMarginTblLoadComplete.call(oThis, data);
}
},
gridComplete: function() {
oThis.adFlexMarginTblGridComplete.call(oThis);
}
});
$("#" + oThis.tableId).trigger('reloadGrid', [{ current: true}]);
$("#" + oThis.tableId).jqGrid('setGridParam',{datatype:'json'});
},
adFlexMarginTblGridComplete: function() {
var oThis = this,
grid = this,
gridName = this.tableId,
gridIds = $("#" + gridName).getDataIDs(),
loopLen,
i = 0,
before,
end,
j=0,
cellName = "site",
rowSpanTaxCount;
for(loopLen = gridIds.length; i < loopLen; i++) {
before = $("#" + gridName).jqGrid('getRowData', gridIds[i]);
$("#" + cellName + gridIds[i]).parent().attr("title", before.siteName);
rowSpanTaxCount = 1;
for (j = i + 1; j < gridIds.length; j++) {
end = $("#" + gridName).jqGrid('getRowData', gridIds[j]);
$("#" + cellName + gridIds[j]).parent().attr("title", end.siteName);
$("#[title='" + before.siteName + "']").children().mouseover(function() {
CompName.Events.fire("TableRowMouseOver", oThis.config.eventGroup, [this]);
});
$("#[title='" + before.siteName + "']").children().mouseout(function() {
CompName.Events.fire("TableRowMouseOut", oThis.config.eventGroup, [this]);
});
if (before.siteName === end.siteName) {
rowSpanTaxCount++;
$("#" + cellName + gridIds[j]).hide();
} else {
rowSpanTaxCount = 1;
break;
}
$("#" + cellName + gridIds[i]).attr("rowspan", rowSpanTaxCount);
}
}
},
adFlexMarginTblLoadComplete: function(data) {
var oThis = this,
loopLen,
i = 0,
jsonData,
gridIds = $("#" + this.tableId).getDataIDs(),
gridData,
arrLen,
j = 0,
siteArray = {},
end;
if(data) {
if(data.pageNo===0)
{
jsonData = data.records;
//i=data.pageNo*gridIds.length;
for(loopLen = gridIds.length; i < loopLen; i++) {
gridData = $("#" + this.tableId).jqGrid('getRowData', gridIds[i]);
if(jsonData[i].platformId === 0 && jsonData[i].parentPlatformId === 1) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else if(jsonData[i].platformId === 0 && jsonData[i].parentPlatformId === 2) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else if(jsonData[i].platformId === jsonData[i].parentPlatformId) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).removeClass("CompNameHide");
}
//Show Add Rule link to parent rule only
if(jsonData[i].platformId === 0 || (jsonData[i].platformId === jsonData[i].parentPlatformId)) {
$(".acactionLinkAdd[data-name='add_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']").removeClass("CompNameHide");
}
else {
$(".acactionLinkAdd[data-name='add_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']").addClass("CompNameHide");
}
if (siteArray[jsonData[i].siteName]) {
siteArray[jsonData[i].siteName]++;
$(".acactionLinkAdd[data-siteName='" +jsonData[i].siteName + "']").addClass("CompNameHide");
} else {
siteArray[jsonData[i].siteName] = 1;
}
if(jsonData[i].platformId === jsonData[i].parentPlatformId || jsonData[i].platformId === 0) {
//Changed siteName to siteId: To resolve BRT issue 522
var cellId = jsonData[i].siteId + "_" + jsonData[i].platformId +"_" + jsonData[i].parentPlatformId;
$("#[data-id='" + cellId + "']").addClass("parentColBg");
}
}
}
if(data.page>=1){
jsonData = data.rows;
//i=(data.page-1)*gridIds.length+1;
for(loopLen = gridIds.length; i < loopLen; i++) {
gridData = $("#" + this.tableId).jqGrid('getRowData', gridIds[i]);
if(jsonData[i].platformId === 0 && jsonData[i].action === 1) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else if(jsonData[i].platformId === 0 && jsonData[i].action === 2) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else if(jsonData[i].platformId === jsonData[i].action) {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).addClass("CompNameHide");
}
else {
$(".acactionLinkDelete[data-name='del_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']" ).removeClass("CompNameHide");
}
//Show Add Rule link to parent rule only
if(jsonData[i].platformId === 0 || (jsonData[i].platformId === jsonData[i].action)) {
$(".acactionLinkAdd[data-name='add_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']").removeClass("CompNameHide");
}
else {
$(".acactionLinkAdd[data-name='add_" + jsonData[i].platformId +"_"+ jsonData[i].siteId + "']").addClass("CompNameHide");
}
if (siteArray[jsonData[i].siteName]) {
siteArray[jsonData[i].siteName]++;
$(".acactionLinkAdd[data-siteName='" +jsonData[i].siteName + "']").addClass("CompNameHide");
} else {
siteArray[jsonData[i].siteName] = 1;
}
if(jsonData[i].platformId === jsonData[i].action || jsonData[i].platformId === 0) {
//Changed siteName to siteId: To resolve BRT issue 522
var cellId = jsonData[i].siteId + "_" + jsonData[i].platformId +"_" + jsonData[i].action;
$("#[data-id='" + cellId + "']").addClass("parentColBg");
}
}
}
}
},
在网格完成中，我们按照上面的屏幕截图应用事件。
现在问题是我点击下一个按钮然后转到第二页。我没有得到旧的json数据。之前我们从data.records获取数据，但现在是data.rows因此记录是渲染但css没有正确应用它。