Question

现在我有

require([
            "dojo/on", "dgrid/OnDemandGrid","dgrid/Tree","dgrid/Editor", "dgrid/Keyboard", "dojo/_base/declare",
            "dgrid/data/createHierarchicalStore", "data/projects_data",
            "dojo/domReady!"
        ], function(
            on, Grid, Tree, Editor, Keyboard, declare, createHierarchicalStore, hierarchicalCountryData
        ){
            var count = 0; // for incrementing edits from button under 1st grid

            function nbspFormatter(value){
                // returns "&nbsp;" for blank content, to prevent cell collapsing
                return value === undefined || value === "" ? "&nbsp;" : value;
            }

            var StandardGrid = declare([Grid, Keyboard, Editor, Tree]);

            window.grid = new StandardGrid({
                collection: createHierarchicalStore({ data: hierarchicalCountryData }, true),
                columns: [
                    {renderExpando: true, label: "Name", field:"variant_name", sortable: false, editor: "text", editOn: "dblclick"},
                    {label: "Visited", field: "bool", sortable: false, editor: "checkbox"},
                    {label:"Project", field:"project", sortable: false, editor: "text", editOn: "dblclick"},
                    {label:"locked", field:"locked", editor: "text", editOn: "dblclick"},
                    {label:"modified", field:"modified", editor: "text", editOn: "dblclick"},
                    {label:"summary", field:"summary", editor: "text", editOn: "dblclick"}
                ]
            }, "treeGrid2");

                grid.on("dgrid-datachange", function(evt){
                    console.log("data changed: ", evt.oldValue, " -> ", evt.value);
                    console.log("cell: ", evt.cell.row.id, evt.cell.column.field);
                });
                grid.on("dgrid-editor-show", function(evt){
                    console.log("show editOn editor: ", evt);
                });
                grid.on("dgrid-editor-hide", function(evt){
                    console.log("hide editOn editor: ", evt);
                });
        });

data / projects是一个包含数据的js文件。但是现在如何将这个dGrid连接到MySQL数据库？在文档中找不到任何好的信息。我想可能是JSON休息的事情，但不确定。

增加：我可以在HTML表中显示db。是否有合适的可能性从HTML表中填充dGrid？

我仍然缺少一些东西。有联系数据库 - ＆gt; PHP 但无法获得适当的JS加载到dStore中的结果。

Answer 1

最简单的前进方法是使用您选择的服务器端语言（在本例中听起来像PHP）编写服务，该服务根据MySQL数据库中的数据生成JSON输出。根据数据的潜在大小，您可以设计数据以使用dstore中的两个开箱即用商店之一：Request（如果还涉及写入操作，则Rest ），或RequestMemory。

两者中较简单的是RequestMemory，它只是将Memory商店的功能与前期服务器请求（通过Request）相结合。此存储将期望服务使用一个完整的数据有效负载进行响应：一个对象数组，其中每个对象都是数据库中的记录。像这样：

[
    {
        "id": 1,
        "foo": "bar"
    },
    {
        "id": 2,
        "foo": "baz"
    }
]

Rest商店期望数据格式相同，但也希望服务处理过滤，排序和范围。过滤和排序通过查询字符串参数表示（例如，foo=bar&baz=bim在最简单的情况下用于过滤器，sort(+foo)或sort(-foo)用于排序），而范围通常通过HTTP Range标头表示（例如，前10项的Range: Items 0-9。

为Rest商店实施服务显然是更多的工作，但如果您期望您的数据源可能包含数千个商品，则会更好，因为RequestMemory将别无选择但要预先要求所有物品。

使用这些商店中的任何一个，一旦您拥有适当输出JSON的服务，您就可以创建商店的实例，其target指向服务端点，然后通过{将其传递给网格{1}}属性。

如果您的数据旨在表示层次结构，则仍应该可以将collection混合到dstore/Tree或dstore/RequestMemory中，前提是您的层次结构是通过父ID引用表示的。默认情况下，dstore/Request会通过每个项目的Tree属性过滤子项，并通过检查每个项目的parent属性来报告mayHaveChildren个结果。

我无法找到一种将数据库源添加到dgrid的优雅方法

1 个答案: