几小时前我遇到了这个问题，我无法绕过它。
我正在尝试将JqGrid实现到我的ASP.NET MVC应用程序中。我使用的是Phil Haack blog post的例子。
我导入了js和css：
<link href="/Content/jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css" />
<link href="/Content/ui.jgrid.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.5.custom.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.jqGrid.min.js" ></script>
<script type="text/javascript" src="/Scripts/grid.local-en.js" ></script>
我把这段代码放在了视野中：
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#list").jqGrid({
url: '/Ticket/All/',
datatype: 'json',
mtype: 'GET',
colNames: ['Id', 'Hardware', 'Issue', 'IssueDetails', 'RequestedBy', 'AssignedTo', 'Priority', 'State'],
colModel: [
{ name: 'Id', index: 'Id', width: 40, align: 'left' },
{ name: 'Hardware', index: 'Hardware', width: 40, align: 'left' },
{ name: 'Issue', index: 'Issue', width: 200, align: 'left' },
{ name: 'IssueDetails', index: 'IssueDetails', width: 200, align: 'left' },
{ name: 'RequestedBy', index: 'RequestedBy', width: 40, align: 'left' },
{ name: 'AssignedTo', index: 'AssignedTo', width: 40, align: 'left' },
{ name: 'Priority', index: 'Priority', width: 40, align: 'left' },
{ name: 'State', index: 'State', width: 40, align: 'left'}],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [5, 10, 20, 50],
sortname: 'Id',
sortorder: "desc",
viewrecords: true,
caption: 'My first grid'
});
});
</script>
<h2>My Grid Data</h2>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
这是我在Ticket控制器中的测试操作：
public ActionResult All(string sidx, string sord, int page, int rows)
{
var jsonData = new
{
total = 1, // we'll implement later
page = page,
records = 3, // implement later
rows = new[]{
new {id = 1, cell = new[] {"1", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}},
new {id = 2, cell = new[] {"2", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}},
new {id = 3, cell = new[] {"3", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}}
}
};
return Json(jsonData);
}
此时，我可以看到空网格，但是整个页面都覆盖了覆盖，我无法点击任何内容（这可能是“加载”叠加层）。
这里有什么问题？
答案 0 :(得分：3)
kMike，
您需要将以下内容添加到return语句中（假设为mvc 2）：
return Json(jsonData, JsonRequestBehavior.AllowGet);
应该有希望解决这个问题。另外，正如在OT上的评论中所指出的那样，检查萤火虫是否有任何与请求有关的问题。
[edit] - 也让你沿着这些线签名，以便更紧密地耦合到返回类型：
public JsonResult All(string sidx, string sord, int page, int rows)
加上，在我的书签中有这个：http://techshorts.blogspot.com/2009/04/json-for-jqgrid-from-aspnet-mvc.html
享受：）
答案 1 :(得分：2)
我看到了更多错误，所以我决定另外给你写信。
首先，最重要的是你应该改变JavaScript文件的顺序。文件grid.local-en.js必须包含 jquery.jqGrid.min.js之前。
我建议您使用jquery-1.4.3.js，它可以更快地使用jqGrid密集使用的CSS 。 jqGrid不需要包含jquery-ui-1.8.5.custom.min.js。 jqGrid仅使用jQuery UI CSS文件（如jquery-ui-1.8.5.custom.css）。只有当您使用jQuery UI Integrations中描述的功能时，您才需要它。
现在有一些小优化评论：
值align: 'left'是默认值，因此您不需要包含它。 pager: jQuery('#pager')可以缩减为pager: '#pager'和
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
到
<table id="list"></table>
<div id="pager"></div>
因为jqGrid因为许多上一版本在<table>和寻呼机<div> itself中进行了所有更改。
如果您的网格有一个唯一的列，并且可以是网格行的ID，则可以在相应的列定义中包含key:true，就像您的情况一样：
{ name: 'Id', index: 'Id', key: true , width: 40 }
它允许您减少从服务器发送的数据量。您可以添加参数jsonReader: { cell:"" }并更改All方法的代码部分，生成rows到
rows = new[]{
new[] {"1", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}},
new[] {"2", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}},
new[] {"3", "hard asdf", "issue adfds", "more issue", "someuser", "otheruser", "2", "Submitted"}}
}
（请参阅this old answer或在documentation中详细了解此内容。）