Jqgrid 3.7 在 Internet Explorer 中不显示行

Question

我正在使用 ASP.NET 和 Jqgrid 3.7 进行测试，在 Firefox 中它工作正常，但在 IE 中它不显示网格中的任何行。

来自 web 服务的响应是

{"d":
    {"__type":"jqGrid",
     "total":"1",
     "page":"1",
     "records":"10",
     "rows":[
         {"id":"180","cell":["180","Cultura"]},
         {"id":"61","cell":["61","Deporte"]},
         {"id":"68","cell":["68","Deporte"]},
         {"id":"5","cell":["5","Economía"]},
         {"id":"67","cell":["67","Economía"]},
         {"id":"76","cell":["76","Economía"]},
         {"id":"178","cell":["178","Economía"]},
         {"id":"4","cell":["4","Entrevista"]},
         {"id":"66","cell":["66","Entrevista"]},
         {"id":"78","cell":["78","Entrevista"]}
     ]
    }
}

，调用是

myGrid = $("#list").jqGrid({
    url: 'ws/WsNoticias.asmx/jqObtenerTemas',
    datatype: 'json',
    mtype: 'GET',
    loadBeforeSend: function(XMLHttpRequest) {
        XMLHttpRequest.setRequestHeader("Content-Type", "application/json");
    },
    colNames: ['Id', 'Nombre'],
    colModel: [
        {name: 'Id', index: 'Id', width: 20, align: 'left', editable: false},
        {name: 'Nombre', index: 'Nombre', width: 200, align: 'left', editable: false}
    ],
    rowNum: 10,
    rowList: [5, 10, 200],
    sortname: 'Nombre',
    sortorder: "asc",
    pager: $("#listp"),
    viewrecords: true,
    caption: '',
    width: 600,
    height: 250,
    jsonReader: {
        root: "d.rows",
        page: "d.page",
        total: "d.total",
        records: "d.records"
    }
});

我看不到问题出在哪里......，对于 3.6 之前的版本，并且使用

thegrid.addJSONData(JSON.parse(jsondata.responseText).d);

而不是 jsonReader 它可以工作。

Answer 1

首先，您应该只使用URL 中的完整路径（以 http:// 或至少以 / 开头）。在很多情况下，Internet Explorer 在使用相对 URL 时会出现错误。

一些更小的一般性评论。您可以使用 ajaxGridOptions: { contentType: 'application/json; charset=utf-8' } 而不是使用 loadBeforeSend。其他一些默认值（请参阅 http://www.trirand.com/ jqgridwiki/doku.php?id=wiki:colmodel_options) 也可以删除。

myGrid = $("#list").jqGrid({
    url: 'http://www.ok-soft-gmbh.com/jqGrid/Jqgrid37json.txt',
    datatype: 'json',
    mtype: 'GET',
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
    colModel: [
        { name: 'Id', width: 20 },
        { name: 'Nombre', width: 200 }
    ],
    rowNum: 10,
    rowList: [5, 10, 200],
    sortname: 'Nombre',
    sortorder: "asc",
    pager: $("#listp"),
    viewrecords: true,
    width: 600,
    height: 250,
    jsonReader: {
        root: "d.rows",
        page: "d.page",
        total: "d.total",
        records: "d.records"
    }
});

此外，您可以将 JSON 数据缩减为

{"d":
    {"__type":"jqGrid",
     "total":"1",
     "page":"1",
     "records":"10",
     "rows":[
         ["180","Cultura"],
         ["61","Deporte"],
         ["68","Deporte"],
         ["5","Economía"],
         ["67","Economía"],
         ["76","Economía"],
         ["178","Economía"],
         ["4","Entrevista"],
         ["66","Entrevista"],
         ["78","Entrevista"]
     ]
    }
}

并在 jsonReader 的定义中添加 poperty 单元格： "":

jsonReader: {
    root: "d.rows",
    page: "d.page",
    total: "d.total",
    cell: "",
    records: "d.records"
}

您可以验证 http://www.ok-soft-gmbh.com/jqGrid/Jqgrid37.htm 和 http://www.ok-soft-gmbh.com/jqGrid/Jqgrid37Comact.htm 一切正常，没有任何问题在所有标准网络浏览器中。