JQgrid 不显示行

Question

这里是 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>

以及return数据列表的方法

 [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 和 header 行正在显示，但其余行未显示。控制器方法也是正确的，它将 return 列表 object.

请帮帮我。

Answer 1

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

这样的数据

{
    "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",
});

JQgrid 不显示行

JQgrid is not showing rows

javascript

asp.net

jquery

jqgrid

jqgrid-asp.net