<div id="gridDiv"></div>
<button id="addRow" data-dojo-type="dijit.form.Button">Add Row</button>
require(['dojo/_base/lang', 'dojox/grid/DataGrid' , 'dojo/data/ItemFileWriteStore' , 'dojo/dom' , 'dojo/domReady!'],
function(lang, DataGrid, ItemFileWriteStore, Button, dom){
/*set up data store*/
var data = {
identifier: "id",
items: []
};
var store = new ItemFileWriteStore({data: data});
/*set up layout*/
var layout = [[
{'name': 'Column 1', 'field': 'id', 'width': '100px'},
{'name': 'Column 2', 'field': 'col2', 'width': '100px'},
{'name': 'Column 3', 'field': 'col3', 'width': '200px'},
{'name': 'Column 4', 'field': 'col4', 'width': '150px'}
]];
/*create a new grid*/
var grid = new DataGrid({
id: 'grid',
store: store,
structure: layout,
rowSelector: '20px'});
/*append the new grid to the div*/
grid.placeAt("gridDiv");
/*Call startup() to render the grid*/
grid.startup();
});
答案 0 :(得分:2)
This fiddle会向商店添加新项目。并且网格将自动更新以反映商店的新内容。
代码的内容是:
var id = 0;
var button = new Button({
onClick: function () {
store.newItem({
id: id,
col2: "col2-" + id,
col3: "col3-" + id,
col4: "col4-" + id
});
id++;
}
}, "addRow");
屏幕截图(按下2个按钮后):