JQgrid 不显示行答案

【问题标题】：JQgrid is not showing rowsJQgrid 不显示行
【发布时间】：2015-04-30 10:57:11
【问题描述】：

这里是 Javascript 代码：

<script type="text/javascript">
    $(function () {
        $("#list").jqGrid({
            url: "/Movies/GetAllMovies",
            datatype: "json",
            mtype: "GET",               
            colNames: ["Id", "Title", "Director", "Date"],
            colModel: [
                { name: 'Id', index: 'Id', sorttype: "int" },
                { name: 'Title', index: 'Title', sortable: false },
                { name: 'Director', index: 'Director', sortable: false },
                { name: 'ReleaseDate', index: 'ReleaseDate', align: "right", sortable: false }
            ],
            viewrecords: true,
            pager: "#pager",
            rowNum: 5,
            rownumbers: true,
            rowList: [5, 10, 15],
            height: 'auto',
            width: '500',              
            caption: "My first grid",
        });
    });


</script>

返回数据列表的方法是

 [HttpGet]
    public JsonResult GetAllMovies()
    {
        var jsonObj = Json(movieAccessLayer.GetAllMovies());
        return Json(jsonObj, JsonRequestBehavior.AllowGet);           
    }

响应字符串：

[{"Id":66,"Title":"BibUtt","Director":"Amal Neeradh","ReleaseDate":"2006-12-12T00:00:00"},{"Id":67,"Title":"Rojaa","Director":"ManiRathnam","ReleaseDate":"1992-05-11T00:00:00"},{"Id":71,"Title":"dwed","Director":"ece","ReleaseDate":"2012-12-12T00:00:00"},{"Id":72,"Title":"Test","Director":"qqwqww","ReleaseDate":"2015-02-09T00:00:00"}]

但问题是：JQgrid 和标题行正在显示，但其余行未显示。控制器方法也是正确的，它会返回一个对象列表。

请帮帮我。

【问题讨论】：

标签： javascript jquery asp.net jqgrid jqgrid-asp.net

【解决方案1】：

我想您发布的返回控制器的数据不准确。你打电话给Json 两次这是第一个错误。 jsonObj 已经有System.Web.Mvc.JsonResult 类型。所以它在Data 属性中有所需的数据。然后你使用 Json(jsonObj, JsonRequestBehavior.AllowGet); 包装返回的结果，GetAllMovies 将返回类似的数据

{
    "ContentEncoding":null,
    "ContentType":null,
    "Data":[{"Id":66,"Title":"BibUtt",...},...],
    "JsonRequestBehavior":1,
    "MaxJsonLength":null,
    "RecursionLimit":null
}

而不是您发布的 JSON 数据。所以你应该将GetAllMovies的代码修改为以下

[HttpGet]
public JsonResult GetAllMovies()
{
    return Json(movieAccessLayer.GetAllMovies(), JsonRequestBehavior.AllowGet);
}

修复后您应该已经看到了结果。我建议您在创建网格的代码中另外做一些简单的更改。例如

$("#list").jqGrid({
    url: "/Movies/GetAllMovies",
    datatype: "json",
    loadonce: true,
    gridview: true,
    autoencode: true,
    jsonReader: { id: "Id" },
    colNames: ["Id", "Title", "Director", "Date"],
    colModel: [
        { name: "Id", sorttype: "int" },
        { name: "Title" },
        { name: "Director" },
        { name: "ReleaseDate", align: "right", formatter: "date", sorttype: "date" }
    ],
    viewrecords: true,
    pager: "#pager",
    rowNum: 5,
    rownumbers: true,
    rowList: [5, 10, "10000:All"],
    height: "auto",
    width: 500,              
    caption: "My first grid",
});

【讨论】：