我正在尝试为ASP.NET MVC 2应用程序创建一个临时查询页面。此页面是安全的,严格用于我们的Intranet上的技术管理访问。我们希望能够查询少数几个表,并且我不希望每个查询都有一个页/网格。我有一个MVC控制器,它返回一个包含以下值的JSON结果(我从客户端javascript警报中得到了这些值,所以我知道这就是这些值在“网格”中的样子):
colNames包含:
['AccountID','ClientID']
colModel包含:
[{editable:false,index:'AccountID',jsonmap:'AccountID',key:false,name:'AccountID',resizable:true,search:false,sortable:true,width:300},
{editable:false,index:'ClientID',jsonmap:'ClientID',key:false,name:'ClientID',resizable:true,search:false,sortable:true,width:300}]
colData包含:
{total:1,page:1,records:1,rows:[{AccountID:1,ClientID:1}]}
而且,在客户端上,我的jqGrid看起来像:
jQuery(document).ready(function () {
$.ajax({
type: 'POST',
url: '<%: Url.Action("GetData", "Support") %>',
data: { query: 'foo' },
dataType: 'json',
success: function (result) {
alert(result.colNames);
alert(result.colModel);
alert(result.colData);
jQuery('#QueryGrid').jqGrid({
jsonReader: { repeatitems: false },
shrinkToFit: true,
datatype: 'jsonstring',
colNames: result.colNames,
colModel: result.colModel,
datastr: result.colData,
viewrecords: true
});
},
error: function (x, e) {
alert(x.readyState + ' ' + x.status + ' ' + e.msg);
}
});
});
我一直根据Stack Overflow上的几个相关帖子/回复以及jqGrid wiki将它们整合在一起。我很确定我非常,非常接近......但它只是没有成功。
我遇到的问题是jqGrid会抛出错误“colNames的长度&lt;&gt; colModel!”我似乎无法弄清楚它不喜欢我的JSON字符串是什么。
任何人都能看到我在这里缺少的东西吗?
答案 0 :(得分:1)
我认为您收到的result.colNames
和result.colModel
数据是字符串而不是对象。
var cn = ['AccountID','ClientID'];
var cm = [
{editable:false,index:'AccountID',jsonmap:'AccountID',key:false,name:'AccountID',
resizable:true,search:false,sortable:true,width:300},
{editable:false,index:'ClientID',jsonmap:'ClientID',key:false,name:'ClientID',
resizable:true,search:false,sortable:true,width:300}];
var cd = '{total:1,page:1,records:1,rows:[{AccountID:1,ClientID:3}]}';
jQuery('#QueryGrid').jqGrid({
jsonReader: { repeatitems: false },
height: 'auto',
colNames: cn,
colModel: cm,
datastr: cd,
viewrecords: true
});
顺便说一下,您在colModel
参数中使用的某些属性是默认的。参数shrinkToFit: true
也是默认值。所以你可以减少到
[{index:'AccountID',jsonmap:'AccountID',name:'AccountID',search:false,width:300},
{index:'ClientID',jsonmap:'ClientID',name:'ClientID',search:false,width:300}]
如果您使用jsonReader: { repeatitems: false, cell:"" }
,那么它可以更短
[{index:'AccountID',name:'AccountID',search:false,width:300},
{index:'ClientID',name:'ClientID',search:false,width:300}]
您真正想要的是将result.colNames
和result.colModel
作为JSON字符串发送,可以将其转换为对象,例如jQuery.parseJSON。在这种情况下,您应该更改result.colNames
和result.colModel
中的数据格式。以下代码也可以使用
var cnStr = '["AccountID","ClientID"]';
var cmStr = '[{"index":"AccountID","name":"AccountID","search":false,"width":300},{"index":"ClientID","name":"ClientID","search":false,"width":300}]';
var cd = '{total:1,page:1,records:1,rows:[{AccountID:1,ClientID:3}]}';
jQuery('#QueryGrid').jqGrid({
jsonReader: { repeatitems: false, cell:"" },
datatype: 'jsonstring',
height:'auto',
colNames: jQuery.parseJSON(cnStr),
colModel: jQuery.parseJSON(cmStr),
datastr: cd,
viewrecords: true
});
还有一个小小的评论。您不在jqGrid数据中使用key:true
或id
值。这是有潜在危险的。如果数据中不存在id
,您应该假设jqGrid使用id =“1”,id =“2”等等。问题可能在于您在一个页面上使用两个或更多此类网格。您很容易收到 double ID ,这是不允许的。