jqgrid-从一页导航到另一页时发生loadComplete错误 [英] jqgrid - loadComplete error when navigating from 1 page to another
问题描述
我正在使用loadComplete事件在jqgrid titlebar和表头之间插入一个div元素.
I am inserting a div element between the jqgrid titlebar and table headers using loadComplete event.
HTML代码
<div class="userinfo">
<table id="myjqgrid"></table>
<div id="Pager"></div>
<script src="js/myjqgrid.js" type="text/javascript"></script>
</div>
JSON
{
"mypage": {
"outerwrapper": {
"page":"1",
"total":"1",
"records":"1",
"innerwrapper": {
"rows":[
{
"id":"1",
"cells":
[
{
"value":"12345",
"label": "ID"
},
{
"value":"David",
"label": "FirstName"
},
{
"value":"Smith",
"label": "LastName"
}
]
},
{
"id":"2",
"cells":
[
{
"value":"37546",
"label": "ID"
},
{
"value":"Willy",
"label": "FirstName"
},
{
"value":"Peacock",
"label": "LastName"
}
]
},
{
"id":"3",
"cells":
[
{
"value":"62345",
"label": "ID"
},
{
"value":"Kim",
"label": "FirstName"
},
{
"value":"Holmes",
"label": "LastName"
}
]
},
{
"id":"4",
"cells":
[
{
"value":"186034",
"label": "ID"
},
{
"value":"Andy",
"label": "FirstName"
},
{
"value":"Wills",
"label": "LastName"
}
]
}
]
}
}
}
}
JQGrid定义(myjqgrid.js)
$(function (){
var getValueByName = function (cells, cellItem) {
var i, count = cells.length, item;
for (i = 0; i < count; i += 1) {
item = cells[i];
if (item.label === cellItem) {
return item.value;
}
}
return '';
};
$("#myjqgrid").jqGrid({
url: "myjqgrid.json",
datatype: "json",
contentType: "application/x-javascript; charset=utf-8",
colNames:['ID','FirstName', 'LastName'],
colModel:[
{name:'ID',index:'ID',jsonmap:function(obj){return getValueByName(obj.cells, "ID");}, width:150, align:"center"},
{name:'FirstName',index:'FirstName',jsonmap:function(obj){return getValueByName(obj.cells, "FirstName");}, width:150, align:"left", sortable:true},
{name:'LastName',index:'LastName',jsonmap:function(obj){return getValueByName(obj.cells, "LastName");}, width:150, align:"left", sortable:true}
],
jsonReader: {
root: "mypage.outerwrapper.innerwrapper.rows",
page: "mypage.outerwrapper.page",
total: "mypage.outerwrapper.total",
records: "mypage.outerwrapper.records",
repeatitems: false
},
rowNum:2,
rowList:[2, 4],
pager: '#Pager',
recordpos: 'left',
multiboxonly:true,
viewrecords: true,
sortorder: "desc",
multiselect: true,
scrolloffset: 0,
loadonce: true,
sortable: true,
sorttype: "text",
cache: true,
height: "auto",
caption: "MY JQGRID",
loadComplete: function(){
$("<div>Table Summary</div>").insertAfter("#gview_myjqgrid .ui-jqgrid-titlebar");
}
});
$("#myjqgrid").jqGrid('navGrid','#Pager',{add:false,del:false,edit:false,position:'right'});
});
问题
正在显示多余的div元素.但是，每次我从一页导航到另一页时，它都会绘制一个额外的div.
The extra div element is getting displayed. BUT each time I navigate from 1 page to another, it draws an extra div.
- 因此，当页面加载时，我得到1
div，内容为表摘要". - 然后，我从第1页导航到第2页，得到2个
div元素，它们显示为表摘要". - 我从第2页导航到第1页，得到3个
div元素，它们显示为表摘要"
- So, when the page loads I get 1
divthat reads 'Table Summary'. - Then I navigate from page 1 to page 2, I get 2
divelements that read 'Table Summary'. - I navigate back from page 2 to page 1, I get 3
divelements that read 'Table Summary'
推荐答案
您最好使用
toolbar: [true,"top"]
jqGrid的
参数以添加空div.如果确实需要手动添加潜水，则应将代码$("<div>Table Summary</div>").insertAfter("#gview_myjqgrid .ui-jqgrid-titlebar");从loadComplete中移出.您应该将代码放置在之后(在$("#myjqgrid").jqGrid({...});之后).
parameter of jqGrid to add empty div. If you do need to add the dive manually you should move the code $("<div>Table Summary</div>").insertAfter("#gview_myjqgrid .ui-jqgrid-titlebar"); out of loadComplete. You should place the code after creating of the grid (after $("#myjqgrid").jqGrid({...});).
这篇关于jqgrid-从一页导航到另一页时发生loadComplete错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
