如何在jqGrid中使用JSON显示太多行数据 [英] How to show too many rows data with JSON in jqGrid
问题描述
我有一个包含15列和60000行的列表，我可以在ASP.NET MVC中通过JSON到达该列表，因此我的jqGrid无法加载数据并在网格中显示它们，但是当行数减少到30000时，它可以正确显示.
I have a list with 15 column and 60000 rows that I reach it by JSON in ASP.NET MVC so my jqGrid cannot load data and show them in grid but when row counts decrease to 30000, it shows correctly.
请帮助我如何解决该问题
Please help me how can I solve that
jQuery("#jqgrid").jqGrid({
url: '@Url.Action("_FillGridProjectCodingCompanyCode", "Letter")' + '?ProjectId=' + ProjectIdVal,
jsonReader: {
repeatitems: false,
root: function (obj) {
return obj.records;
}
},
datatype: "json",
height: 'auto',
colNames: ['', 'Archive_DCC_Coding_Id', 'SubProject'
, 'Plant', 'PlantUnit', 'SubUnit', 'Discipline', 'Facility', 'Activity Code',
'Activity', 'FIECo. DOC No.', 'Revision', 'Document title & Description', ' Client No',
' transmittal No', 'transmittal'
,'transmittal status', 'status', 'Latest Respansibility'
],
colModel: [
{
name: 'act',
index: 'act',
sortable: false,
width: 25,
search:false
},
{
name: 'Archive_DCC_Coding_Id',
index: 'Archive_DCC_Coding_Id',
hidden: true,
search: false,
searchoptions: { sopt: ['eq', 'ne', 'le', 'lt', 'gt', 'ge'] }//عدد
},
{
name: 'Sub_Proj_Code',
index: 'Sub_Proj_Code',
width: 70,
hidden: true,
search:true,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'Plant_Code',
index: 'Plant_Code',
width: 70,
hidden: true,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'Plant_unit_code',
index: 'Plant_unit_code',
width: 70,
hidden: true,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
}
,
{
name: 'sub_unit_code',
index: 'sub_unit_code',
width: 70,
hidden: true,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'discipline',
index: 'discipline',
width: 70,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'facility',
index: 'facility',
width: 70,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'Act_PrimaveraId',
index: 'Act_PrimaveraId',
width: 70,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'Act_Name',
index: 'Act_Name',
width: 100,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'comp_code',
index: 'comp_code',
width: 100,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'Comp_Revision',
index: 'Comp_Revision',
width: 50,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'comp_subject',
index: 'comp_subject',
width: 150,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'client_document_no',
index: 'client_document_no',
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'trans_ref_no',
index: 'trans_ref_no',
width: 100,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'ChkMain_Subject',
index: 'ChkMain_Subject',
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name:'chkMain_status',
index: 'chkMain_status',
width: 50,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'last_status',
index: 'last_status',
width: 100,
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
},
{
name: 'last_receiver',
index: 'last_receiver',
searchoptions: { sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en'] }
}
],
rowNum: 5,
rowList: [5,10,15, 20,25, 30],
toppager: true,
pager: '#pjqgrid',
sortname: 'comp_code',
toolbarfilter: true,
viewrecords: true,
sortable: true,
sortorder: "asc",
loadonce: true,
gridview: true,
shrinkToFit: true,
gridComplete: function () {
var ids = jQuery("#jqgrid").jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++) {
var cl = ids[i];
ed = "<button class='btn btn-xs btn-default' type='button' onclick=\"EditLetter('" + cl + "');\" data-toggle='modal' data-target='#EditLetterModal'><i class='fa fa-pencil'></i></button>";
ins = "<button class='btn btn-xs btn-default' type='button' onclick=\"InsertLetter('" + cl + "');\" data-toggle='modal' data-target='#LetterModal'><i class='fa fa-plus'></i></button>";
chain = "<button class='btn btn-xs btn-default' type='button' onclick=\"ViewLetter('" + cl + "');\" data-toggle='modal' data-target='#LetterChainModal'><i class='fa fa-chain'></i></button>";
jQuery("#jqgrid").jqGrid('setRowData', ids[i], {
act: ed + ins+chain
});
}
},
editurl: "dummy.html",
caption: "Document ",
width: '100%'
}).jqGrid('navGrid', '#pjqgrid', { edit: false, add: false, del: false, refresh: true, view: false, cloneToTop: true },
{}, {}, {}
, {
multipleSearch: true,
multipleGroup: true,
showQuery: true
}
)
;
推荐答案
您没有发布您使用的ASP.NET MVC版本以及哪个JSON序列化程序.您不会以相同的方式发布使用的jqGrid版本以及jqGrid的哪个分支(免费的jqGrid ，商业 Guriddo jqGrid JS 或版本低于< = 4.7的旧jqGrid).您可以在
You don't posted which version of ASP.NET MVC you use and which JSON serializer. In the same way you don't posted which version of jqGrid you use and from which fork of jqGrid (free jqGrid, commercial Guriddo jqGrid JS or an old jqGrid in version <=4.7). You can verify on the demo the performance of the grid with 60000 rows of data and 15 columns. I used in the demo free jqGrid 4.13.6 - the fork which I develop.
我想您的问题是纯粹的服务器端问题，并且受JSON序列化数据大小的限制.例如，如果ASP.NET MVC使用旧的JavaScriptSerializer序列化程序，则必须增加全局属性MaxJsonLength的值.请参阅旧答案以及更多详细信息.可能另一个答案对您来说甚至更好.
I suppose that your problem is pure server-side problem with the limit of the size of JSON serialized data. For example one have to increase the value of globally property MaxJsonLength if ASP.NET MVC uses old JavaScriptSerializer serializer. See the old answer and for more detailes. It could be that another answer would be even better for you.
此外，我建议您验证您的要求.对于您的数据，可能使用服务器端分页，排序和过滤日期会更好，因为行数或行足够大.
Additionally I would recommend you to verify your requirements. It could be that the usage of server-side paging, sorting and filtering the date would be better in case of your data, because the number or rows is large enough.
这篇关于如何在jqGrid中使用JSON显示太多行数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
