Question

Restfull api让json很好。尝试使用json数据在html页面上填充jsGrid。必须从根本上做错事，因为我发现失败的所有例子。我看到的是“未找到”的列名称只写为行。

有什么想法吗？

这仍然给我“未找到”：

    controller: {
            loadData: function(filter) {
            return {
                      data: [{"Name":"Edmund","Age": "25"},
                             {"Name":"Edmund","Age": "25"}
                            ],
                      itemsCount: 2
                  };
            }
        },

    fields: [
        { name: "Name", type: "text", width: 150 },
        { name: "Age", type: "text", width: 50 }
    ]
});

Answer 1

jsGrid期望数据采用以下格式。

{"data":[...],"itemsCount":<data count>}

最初，我遇到了同样的问题。所以，我首先尝试从控制器发送硬编码字符串，如下所示

String responseStr = "{\"data\":[{\"fld_1\": \"val1\",\"fld_2\": \"val2\"},{\"fld_1\": \"val3\",\"fld_2\": \"val4\"],\"itemsCount\":2}";

有效。现在，我们使用一些数据对象，如下所示

public class MyDataDO {
    private List<Map<String, Object>> data;
    private int itemsCount;
    //setter/getter
}

另外，您能否确保将autoload设置为正确的值？

修改

您可以按照以下方式进行操作

... controller: { loadData: function(filter) { return { data: [{"field_1":"val1","field_2": "val2"}, {"field_1":"val3","field_2": "val4"} ], itemsCount: 2 }; } }

以下页面显示正常。所有js和css文件都来自jsgrid附带的发行版。

<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="demos.css" /> <link rel="stylesheet" type="text/css" href="../css/jsgrid.css" /> <link rel="stylesheet" type="text/css" href="../css/theme.css" /> <script src="../external/jquery/jquery-1.8.3.js"></script> <script src="../src/jsgrid.core.js"></script> <script src="../src/jsgrid.load-indicator.js"></script> <script src="../src/jsgrid.load-strategies.js"></script> <script src="../src/jsgrid.sort-strategies.js"></script> <script src="../src/jsgrid.field.js"></script> </head> <body> <div id="jsGrid"></div> <script> $(function() { $("#jsGrid").jsGrid({ pageLoading : true, autoload: true, controller: { loadData: function(filter) { return { data: [ {"Name":"Edmund","Age": "25"}, {"Name":"Edmund","Age": "25"} ], itemsCount: 2 }; }, }, fields: [ { name: "Name", type: "text", width: 100 }, { name: "Age", type: "text", width:150} ] }); }); </script> </body> </html>

jsGrid没有加载Spring-boot json

1 个答案: