jsGrid 不会呈现 JSON 数据答案

【问题标题】：jsGrid won't render JSON datajsGrid 不会呈现 JSON 数据
【发布时间】：2016-12-08 12:22:51
【问题描述】：

我正在尝试在我的 MVC 项目中使用 jsGrid，因为客户端需要内联编辑和过滤。但是，我无法让它将我的 JSON 源加载到表中。我加载表格的 js 如下所示：

$("#jsGrid").jsGrid({
            height: "50%",
            width: "100%",

            filtering: true,
            inserting: true,
            editing: true,
            sorting: true,
            paging: true,
            autoload: true,

            pageSize: 10,
            pageButtonCount: 5,

            deleteConfirm: "Do you really want to delete client?",

            controller: {
                loadData: function (filter) {
                    return $.ajax({
                        type: "GET",
                        url: "RICInstrumentCode/GetData",
                        data: filter,
                        dataType: "json"
                    });
                },

                insertItem: function (item) {
                    return $.ajax({
                        type: "CREATE",
                        url: "/api/RICInsrumentCodeTable",
                        data: item,
                        dataType: "json"
                    });
                },

                updateItem: function (item) {
                    return $.ajax({
                        type: "UPDATE",
                        url: "/api/RICInsrumentCodeTable/" + item.ID,
                        data: item,
                        dataType: "json"
                    });
                },

                deleteItem: $.noop

                //deleteItem: function (item) {
                //    return $.ajax({
                //        type: "DELETE",
                //        url: "/api/data/" + item.ID,
                //        dataType: "json"
                //    });
                //}
            },

            fields: [
                { name: "Code", type: "text", title: "RIC Instrument Code", width: 150 },
                { name: "Descr", type: "text", title:"RIC Instrument Code Description", width: 200 },
                { name: "RICInstrumentGroupId", type: "select", title: "RIC Instrument Group", items: countries, valueField: "Id", textField: "Name" },
                { name: "Active", type: "checkbox", title: "Is Active", sorting: true },
                { type: "control" }
            ]
        });

    });

loadData 是我一直在研究的。

从 get data 返回的 JSON 如下所示：

[{"Id":1,"Code":"test1","Descr":"first code test","RICInstrumentGroupId":2,"Active":true},{"Id":2,"Code":"APP","Descr":"Apples and bananas","RICInstrumentGroupId":4,"Active":true},{"Id":3,"Code":"1","Descr":"1","RICInstrumentGroupId":1,"Active":true},{"Id":4,"Code":"3","Descr":"3","RICInstrumentGroupId":3,"Active":false}]

到目前为止，我已经确认 ajax 正在触发，更改了我的数组标题以匹配调用的标题，并确保返回是有效的 JSON，我还能做什么？

我一生都无法弄清楚为什么这不起作用。任何帮助将不胜感激。提前致谢，杰登莱默

【问题讨论】：

ajax 触发了吗？
是的，我的控制器中有一个断点，它每次都会命中它，返回一个带有上述 json 的数组

标签： javascript jquery json asp.net-mvc jsgrid

【解决方案1】：

我是愚蠢的，设置表格高度的位在没有高度的 div 中设置为 100%，这导致表格主体以 0px 的高度呈现，将高度属性更改为自动修复它，因为数据一直都在那里.

感谢您的建议！

【讨论】：

【解决方案2】：

我不知道是否需要，但是当我查看演示示例（OData 服务）时。网格 loadData 函数看起来和你的有点不同。

loadData: function() {
    var d = $.Deferred();

    $.ajax({
        url: "http://services.odata.org/V3/(S(3mnweai3qldmghnzfshavfok))/OData/OData.svc/Products",
        dataType: "json"
    }).done(function(response) {
        d.resolve(response.value);
    });

    return d.promise();
}

是接受承诺而不是 ajax 函数。让我成为问题

在这里演示：http://js-grid.com/demos/

【讨论】：