如何在jqGrid中快速加载数据 [英] How to quickly load data in jqGrid
问题描述
问题是在jqgrid中加载数据需要很多时间,目前我正在使用
The problem is loading data in jqgrid takes a lot of time, currently I am using
for(var i=0;i<homeFileList.length;i++)
jQuery("#tblHomeFileList").jqGrid('addRowData',i+1,homeFileList[i]);
要将数据加载到网格中,但是由于要进行迭代,因此要花费大量时间,是否有任何方法可以更快地加载数据?
to load data into the grid, but since it is iterating, it is taking a lot of time, is there any way to load data faster?
我阅读了addRowData
甚至可以一次插入多个数据(阅读Link ),我认为它可能会更快,但它不会在网格中插入任何内容
I read the addRowData
can even insert multiple data at once (Reading Link), i thought it might be faster, but it does not insert anything to my grid
请参阅下面的代码.
var homeFileList=[];
$(xml).find('IPC').each(function(){
$(this).children('homefilelist').each(function(){
$(this).children('homefilelist_info').each(function(){
var row={};
isPresent=true;
row.permission=$(this).attr('permission');
row.hardlink=$(this).attr('hardlink');
row.owner=$(this).attr('owner');
row.group=$(this).attr('group');
row.fsize=$(this).attr('fsize');
row.month=$(this).attr('month');
row.date=$(this).attr('date');
row.time=$(this).attr('time');
row.filename=$(this).attr('filename');
homeFileList.push(row);
});
});
});
在Oleg评论后更新
//HomeFileList
if(homeFileList.length>0)
{
jQuery("#tblHomeFileList").jqGrid({
datatype: "clientSide",
colNames:['Permission','Hardlink','Owner','Group','Size','Month','Date','Year/Time','Filename'],
colModel:[
{name:'permission',index:'permission', align:"left",width:"100px"},
{name:'hardlink',index:'hardlink', align:"left", width:"80px"},
{name:'owner',index:'owner', align:"left",width:"100px"},
{name:'group',index:'group', align:"left"},
{name:'fsize',index:'fsize', align:"left", width:"90px"},
{name:'month',index:'month', align:"left",width:"100px"},
{name:'date',index:'date', align:"left", width:"80px"},
{name:'time',index:'time', align:"left",width:"100px"},
{name:'filename',index:'filename', align:"left"}
],
pager : '#HomeFileListGridpager',
rowNum:10,
rowList:[10,50,100],
scrollOffset:0,
height: 'auto',
autowidth:true,
viewrecords: true,
gridview: true
});
/*This for loop loads my data from homeFileList into grid
for(var i=0;i<homeFileList.length;i++)
jQuery("#tblHomeFileList").jqGrid('addRowData',i+1,homeFileList[i]);*/
alert($.isArray(homeFileList)); //returns true
jQuery("#tblHomeFileList").jqGrid('addRowData',homeFileList);
jQuery("#tblHomeFileList").setGridParam({rowNum:10}).trigger("reloadGrid");
}
else
gridUnavailable("#tblHomeFileList");
XML响应(我在下面缩短了xml,因为它是homefilelist
中的巨大数据)
XML response (I have cut short the xml below, as it is huge data inside homefilelist
)
<?xml-stylesheet type="text/xsl" href="client9.xsl"?><client version="1.0"><IPC>
<homefilelist>
<homefilelist_info permission='-rwxr-xr-x' hardlink='1' owner='asimon' group='support' fsize='61597' month='Mar' date='22' time='2011' filename='libpmwspsvrcmn.so' />
<homefilelist_info permission='-rwxr-xr-x' hardlink='1' owner='asimon' group='support' fsize='21778' month='Mar' date='22' time='2011' filename='libpmorablk.so' />
<homefilelist_info permission='-rwxr-xr-x' hardlink='1' owner='asimon' group='support' fsize='36226' month='Mar' date='22' time='2011' filename='libpmjvm.so' />
</homefilelist>
</IPC>
</client>
推荐答案
您可以使用jqGrid的data
参数:
You can use data
parameter of jqGrid:
$("#tblHomeFileList").jqGrid({
datatype: "local",
data: homeFileList,
...
});
请参见演示.在这种情况下,网格的整个数据将被放置在网格中,并且第一页将被绘制.我相信您会立即看到大量行的性能差异.
See the demo. In the case the whole data of the grid will be placed in the grid and the first page will be paint. I am sure that you will see the difference in the performance for large number of rows immediately.
我建议您在网格中另外包含formatter
和sorttype
属性.例如,保存整数数据的'fsize'
的定义可以如下:
I recommend you additionally include formatter
and sorttype
attributes in the grid. For example the definition of 'fsize'
which hold integer data can be the following:
{name: 'fsize', index: 'fsize', width: 90, formatter: 'integer', sorttype: 'int'}
这篇关于如何在jqGrid中快速加载数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!