如何将JsonRestStore与搜索表单和可编辑的DataGrid一起使用

时间:2014-07-22 15:52:16

标签: datagrid dojo jsonreststore

我正在尝试实现一个搜索表单,其中结果将通过dojo 1.6数据网格显示。我有渲染工作,我在表单提交上进行ajax调用,然后使用ItemFileWriteStore在回调函数中构建一个Datagrid。

 function search()
{
    var action = './search.json';
    dojo.xhrPost({url: action, form:"searchForm",
                    load: function(result) {
                                            var newStore = new dojo.data.ItemFileWriteStore({
                                                data: {
                                                    identifier: "id", 
                                                   items: JSON.parse(result),
                                                   url:'./search.json'
                                                }
                                            });
                                            var grid = dijit.byId("searchResultsGrid");

                                            if(grid == null) {
                                                var layout = [[
                                                      {'name': 'Id', 'field': 'id', 'width': '50px'},
                                                      {'name': 'Name', 'field': 'name', 'width': '50px',editable: true,},
                                                      {'name': 'Source', 'field': 'source', 'width': '50px',editable: true,},
                                                      {'name': 'Version', 'field': 'version', 'width': '50px',editable: true,}
                                                    ]];

                                                var grid = new dojox.grid.DataGrid({
                                                    id: 'searchResultsGrid',
                                                    store: newStore,
                                                    structure: layout,
                                                    autoHeight:true, autoWidth:true, editable:true, columnReordering:true,
                                                    rowSelector: '20px'
                                                });
                                                grid.placeAt("gridDiv");
                                                grid.startup();
                                            }
                                            else {
                                                grid.setStore(newStore);
                                            }
                                         }
    });
}

现在,当我尝试使网格可编辑并将更改持久保存到服务器时,ItemFileWriteStore没有任何反应。所以我想切换到JsonRestStore,这样我就可以坚持下去。

但问题是,我如何将表单提交绑定到JsonRestStore,或者换句话说,有没有办法将动态查询传递给JsonRestStore? 我希望JsonRestStore获取有关提交我的搜索表单的数据,并根据搜索表单中的值。

提前致谢!

1 个答案:

答案 0 :(得分:0)

我会使用dojo.store.JsonRest商店。为了将JsonRest存储与dojox.grid.DataGrid一起使用,您需要将它包装在dojo.data.ObjecStore中,如下所示:

var newStore = new dojo.store.JsonRest({
    target: '/search/',
    idProperty: 'id'
});
newStore = new dojo.data.ObjectStore({
    objectStore: newStore
});

现在/ search / target应该是您的REST网址。 / search /的后端应该能够支持REST,这意味着你应该能够支持GET,PUT,POST,DELETE请求。看看它为Dojo 1.10的http://dojotoolkit.org/reference-guide/1.10/quickstart/rest.html,但实现后端的方法应该是类似的。

实施REST后端后,可以检索和更新数据。您可以通过在网格中设置查询参数来将查询参数发送到REST后端。

grid.setQuery({
   param1: 1,
   param2: 2
});

这将触发JsonRest存储使用url / search /?param1 = 1& param2 = 2来加载网格中的刷新数据集。

相关问题