令人头疼的动态数据 jqGrid

Question

您好，我正在使用从后端返回的动态数据实现 jqGrid，我正在遵循此处讨论的类似解决方案：

similar stack over flow question

由于某种原因，单元格不会填充数据，我尝试了无数不同的方法，但无法获得任何乐趣。下面是代码：

        $.ajax({
    type: "GET",
    url: "http://cw-epjdp-d01.tm-gnet.com:10040/wps/PA_Resource_Manager_1/JSONMovementServlet",
    dataType: "json",
    success: function(result){
            var colD = result;
            //console.log(colD);
            var colN = result.MOVEMENTS.columnNames;
            var colM = result.MOVEMENTS.colModelList;
            console.log(colN);
        $("#movementTable").jqGrid({
            datatype: 'local',
            data: colD.MOVEMENTS.rows,
            colNames: colN,
            colModel :colM,
            height: "auto", 
            loadComplete: function(data){
                console.log("data loaded...");
            },
            loadError: function(xhr,status,error){
                alert('error');
            }
        });
    },
    error: function(x, e){
        alert(x.readyState + " "+ x.status +" "+ e.msg);
    }
});

以下是返回的 JSON 示例：

{
"MOVEMENTS": {
    "currpage": "1",
    "totalpages": "3",
    "totalrecords": "8",
    "rows": [
        {
            "id": "uid\u003dAshokPandey",
            "cells": [
                {
                    "NAME": "uid\u003dAshokPandey",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Holiday",
                    "DAY3": "Holiday",
                    "DAY4": "Holiday",
                    "DAY5": "Holiday",
                    "DAY6": "Holiday",
                    "DAY7": "Holiday",
                    "DAY8": "Holiday",
                    "DAY9": "Holiday",
                    "DAY10": "Holiday",
                    "DAY11": "Holiday",
                    "DAY12": "Holiday",
                    "DAY13": "Holiday",
                    "DAY14": "Holiday"
                }
            ]
        },
        {
            "id": "uid\u003dGarethHarris",
            "cells": [
                {
                    "NAME": "uid\u003dGarethHarris",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Canary Wharf",
                    "DAY3": "Canary Wharf",
                    "DAY4": "Canary Wharf",
                    "DAY5": "Canary Wharf",
                    "DAY6": "Canary Wharf",
                    "DAY7": "Canary Wharf",
                    "DAY8": "Canary Wharf",
                    "DAY9": "Canary Wharf",
                    "DAY10": "Canary Wharf",
                    "DAY11": "Canary Wharf",
                    "DAY12": "Canary Wharf",
                    "DAY13": "Canary Wharf",
                    "DAY14": "Canary Wharf"
                }
            ]
        },
        {
            "id": "uid\u003dKeithPriddle",
            "cells": [
                {
                    "NAME": "uid\u003dKeithPriddle",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Canary Wharf",
                    "DAY3": "Canary Wharf",
                    "DAY4": "Canary Wharf",
                    "DAY5": "Canary Wharf",
                    "DAY6": "Canary Wharf",
                    "DAY7": "Canary Wharf",
                    "DAY8": "Canary Wharf",
                    "DAY9": "Canary Wharf",
                    "DAY10": "Canary Wharf",
                    "DAY11": "Canary Wharf",
                    "DAY12": "Canary Wharf",
                    "DAY13": "Canary Wharf",
                    "DAY14": "Canary Wharf"
                }
            ]
        },
        {
            "id": "uid\u003dJonathanPopoola",
            "cells": [
                {
                    "NAME": "uid\u003dJonathanPopoola",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Sickness",
                    "DAY3": "Sickness",
                    "DAY4": "Sickness",
                    "DAY5": "Sickness",
                    "DAY6": "Sickness",
                    "DAY7": "Sickness",
                    "DAY8": "Sickness",
                    "DAY9": "Sickness",
                    "DAY10": "Sickness",
                    "DAY11": "Sickness",
                    "DAY12": "Sickness",
                    "DAY13": "Sickness",
                    "DAY14": "Sickness"
                }
            ]
        },
        {
            "id": "uid\u003dNaveedZaib",
            "cells": [
                {
                    "NAME": "uid\u003dNaveedZaib",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Sickness",
                    "DAY3": "Sickness",
                    "DAY4": "Sickness",
                    "DAY5": "Sickness",
                    "DAY6": "Sickness",
                    "DAY7": "Sickness",
                    "DAY8": "Sickness",
                    "DAY9": "Sickness",
                    "DAY10": "Sickness",
                    "DAY11": "Sickness",
                    "DAY12": "Sickness",
                    "DAY13": "Sickness",
                    "DAY14": "Sickness"
                }
            ]
        },
        {
            "id": "uid\u003dPooyanFarahani",
            "cells": [
                {
                    "NAME": "uid\u003dPooyanFarahani",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Canary Wharf",
                    "DAY3": "Canary Wharf",
                    "DAY4": "Canary Wharf",
                    "DAY5": "Canary Wharf",
                    "DAY6": "Canary Wharf",
                    "DAY7": "Canary Wharf",
                    "DAY8": "Canary Wharf",
                    "DAY9": "Canary Wharf",
                    "DAY10": "Canary Wharf",
                    "DAY11": "Canary Wharf",
                    "DAY12": "Canary Wharf",
                    "DAY13": "Canary Wharf",
                    "DAY14": "Canary Wharf"
                }
            ]
        },
        {
            "id": "uid\u003dWendyBuchta",
            "cells": [
                {
                    "NAME": "uid\u003dWendyBuchta",
                    "DAY1": "Canary Wharf",
                    "DAY2": "AWOL",
                    "DAY3": "AWOL",
                    "DAY4": "AWOL",
                    "DAY5": "AWOL",
                    "DAY6": "AWOL",
                    "DAY7": "AWOL",
                    "DAY8": "AWOL",
                    "DAY9": "AWOL",
                    "DAY10": "AWOL",
                    "DAY11": "AWOL",
                    "DAY12": "AWOL",
                    "DAY13": "AWOL",
                    "DAY14": "AWOL"
                }
            ]
        },
        {
            "id": "uid\u003dEdwardRios",
            "cells": [
                {
                    "NAME": "uid\u003dEdwardRios",
                    "DAY1": "Canary Wharf",
                    "DAY2": "Canary Wharf",
                    "DAY3": "Canary Wharf",
                    "DAY4": "Canary Wharf",
                    "DAY5": "Canary Wharf",
                    "DAY6": "Canary Wharf",
                    "DAY7": "Canary Wharf",
                    "DAY8": "Canary Wharf",
                    "DAY9": "Canary Wharf",
                    "DAY10": "Canary Wharf",
                    "DAY11": "Canary Wharf",
                    "DAY12": "Canary Wharf",
                    "DAY13": "Canary Wharf",
                    "DAY14": "Canary Wharf"
                }
            ]
        }
    ],
    "colModelList": [
        {
            "INDEX": "NAME",
            "LABEL": "NAME",
            "WIDTH": "90",
            "NAME": "NAME",
            "JSONMAP": "CELLS.0.NAME"
        },
        {
            "INDEX": "Mon Jan 31",
            "LABEL": "Mon Jan 31",
            "WIDTH": "90",
            "NAME": "Mon Jan 31",
            "JSONMAP": "CELLS.0.Mon Jan 31"
        },
        {
            "INDEX": "Tue Feb 01",
            "LABEL": "Tue Feb 01",
            "WIDTH": "90",
            "NAME": "Tue Feb 01",
            "JSONMAP": "CELLS.0.Tue Feb 01"
        },
        {
            "INDEX": "Wed Feb 02",
            "LABEL": "Wed Feb 02",
            "WIDTH": "90",
            "NAME": "Wed Feb 02",
            "JSONMAP": "CELLS.0.Wed Feb 02"
        },
        {
            "INDEX": "Thu Feb 03",
            "LABEL": "Thu Feb 03",
            "WIDTH": "90",
            "NAME": "Thu Feb 03",
            "JSONMAP": "CELLS.0.Thu Feb 03"
        },
        {
            "INDEX": "Fri Feb 04",
            "LABEL": "Fri Feb 04",
            "WIDTH": "90",
            "NAME": "Fri Feb 04",
            "JSONMAP": "CELLS.0.Fri Feb 04"
        },
        {
            "INDEX": "Sat Feb 05",
            "LABEL": "Sat Feb 05",
            "WIDTH": "90",
            "NAME": "Sat Feb 05",
            "JSONMAP": "CELLS.0.Sat Feb 05"
        },
        {
            "INDEX": "Sun Feb 06",
            "LABEL": "Sun Feb 06",
            "WIDTH": "90",
            "NAME": "Sun Feb 06",
            "JSONMAP": "CELLS.0.Sun Feb 06"
        },
        {
            "INDEX": "Mon Feb 07",
            "LABEL": "Mon Feb 07",
            "WIDTH": "90",
            "NAME": "Mon Feb 07",
            "JSONMAP": "CELLS.0.Mon Feb 07"
        },
        {
            "INDEX": "Tue Feb 08",
            "LABEL": "Tue Feb 08",
            "WIDTH": "90",
            "NAME": "Tue Feb 08",
            "JSONMAP": "CELLS.0.Tue Feb 08"
        },
        {
            "INDEX": "Wed Feb 09",
            "LABEL": "Wed Feb 09",
            "WIDTH": "90",
            "NAME": "Wed Feb 09",
            "JSONMAP": "CELLS.0.Wed Feb 09"
        },
        {
            "INDEX": "Thu Feb 10",
            "LABEL": "Thu Feb 10",
            "WIDTH": "90",
            "NAME": "Thu Feb 10",
            "JSONMAP": "CELLS.0.Thu Feb 10"
        },
        {
            "INDEX": "Fri Feb 11",
            "LABEL": "Fri Feb 11",
            "WIDTH": "90",
            "NAME": "Fri Feb 11",
            "JSONMAP": "CELLS.0.Fri Feb 11"
        },
        {
            "INDEX": "Sat Feb 12",
            "LABEL": "Sat Feb 12",
            "WIDTH": "90",
            "NAME": "Sat Feb 12",
            "JSONMAP": "CELLS.0.Sat Feb 12"
        },
        {
            "INDEX": "Sun Feb 13",
            "LABEL": "Sun Feb 13",
            "WIDTH": "90",
            "NAME": "Sun Feb 13",
            "JSONMAP": "CELLS.0.Sun Feb 13"
        }
    ],
    "columnNames": [
        "NAME",
        "Mon Jan 31",
        "Tue Feb 01",
        "Wed Feb 02",
        "Thu Feb 03",
        "Fri Feb 04",
        "Sat Feb 05",
        "Sun Feb 06",
        "Mon Feb 07",
        "Tue Feb 08",
        "Wed Feb 09",
        "Thu Feb 10",
        "Fri Feb 11",
        "Sat Feb 12",
        "Sun Feb 13"
    ]
}

}

请注意，通过http://www.jsonlint.com/ 验证的 JSON 是有效的，我别无选择，只能使用提供的 id。

提前非常感谢

Answer 1

查看加载 json 数据的演示 http://www.trirand.com/blog/jqgrid/jqgrid.html

或者jsonReader的用法在 http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data

Answer 2

在上一个答案中我说你应该使用 jqGrid 的jsonReader 参数。内部带有“=”字符的ID的使用也很糟糕。例如，如果您在数据库中有 "uid=AndrewBryant" 作为 id，则可以将 "AndrewBryant" 作为 HTML id 放在 JSON 数据中。如果你说你“别无选择”，我不同意。

在您当前的示例中，您在服务器端犯了太多错误，并且没有使用jsonReader 或localReader，因此很难在此处发表评论。例如，您在数据中使用cells，在jsonmap 列属性中使用“CELLS”，您以错误的方式将其写入JSONMAP。在 JavaScript 中，字符的大小写非常重要。此外，您使用 "NAME": "Mon Jan 31" 而不是“名称”和标识符作为值。标识符不能有空格。当然，JSON 数据中没有属性为“Mon Jan 31”的数据。

最后，您使用data 参数（data: colD.MOVEMENTS.rows），这意味着使用localReader 而不是jsonReader（有关here 的更多信息，请参阅localReader）。

抱歉，您当前的代码和数据太脏了，包含太多错误，看起来都是垃圾，无法正常工作。