我正在使用MemoryStore、Observable和ObjectStore将数据绑定到EnhancedGrid。但是当将一行添加到EnhancedGrid时，新添加的行单元格显示为（…）。当我尝试编辑该单元格时，它显示为未定义，并以异常结束。
Javascript：
require(['dojo/_base/lang', 'dojox/grid/EnhancedGrid', 'dojo/data/ItemFileWriteStore', 'dijit/form/Button', 'dojo/dom', 'dojo/domReady!', 'dojo/store/Memory', 'dojo/store/Observable', 'dojo/data/ObjectStore'],
function (lang, EnhancedGrid, ItemFileWriteStore, Button, dom, domReady, Memory, Observable, ObjectStore) {
/*set up data store*/
var data = {
identifier: "id",
items: []
};
var gridMemStore = new Memory({ data: data });
var gridDataStore = Observable(gridMemStore);
var store = new ObjectStore({ objectStore: gridDataStore });
/*set up layout*/
var layout = [
[{
'name': 'Column 1',
'field': 'id',
'width': '100px'
}, {
'name': 'Column 2',
'field': 'col2',
'width': '100px',
editable: true
}, {
'name': 'Column 3',
'field': 'col3',
'width': '200px',
editable: true
}, {
'name': 'Column 4',
'field': 'col4',
'width': '150px'
}]
];
/*create a new grid*/
var grid = new EnhancedGrid({
id: 'grid',
store: store,
items: data.items,
structure: layout,
rowSelector: '20px'
});
/*append the new grid to the div*/
grid.placeAt("gridDiv");
/*Call startup() to render the grid*/
grid.startup();
var id = 0;
var button = new Button({
onClick: function () {
console.log(arguments);
grid.store.newItem({
id: id
});
id++;
}
}, "addRow");
});
HTML:
<body class="claro">
<div id="gridDiv"></div>
<button id="addRow" data-dojo-type="dijit.form.Button">Add Row</button>
</body>
请帮帮我。这个代码缺少什么？
如何添加空行而不考虑列的数据类型？
在发布的代码中，您需要删除dataGrid构造函数中的items参数才能使示例工作。这里有一个可能的解决方案：
要删除。。。在单元格中，为每个字段使用自定义格式化程序，为了避免未定义的字段，请使用get函数。文档http://dojotoolkit.org/reference-guide/1.10/dojox/grid/DataGrid.html
/*set up layout*/
var layout = [
[{
'name': 'Column 1',
'field': 'id',
'width': '100px'
}, {
'name': 'Column 2',
'field': 'col2',
'width': '100px',
editable: true,
formatter: function (item) {
return '';
},
get: function (rowIdx, item) {
return '';
}
}, {
'name': 'Column 3',
'field': 'col3',
'width': '200px',
editable: true,
formatter: function (item) {
return '';
},
get: function (rowIdx, item) {
return '';
}
}, {
'name': 'Column 4',
'field': 'col4',
'width': '150px'
}]
];