带有空存储的 ExtJS 网格，在添加/插入时仅显示添加的最新记录
我有一个加载时为空的网格，我想根据按钮单击进行填充。
如果商店一开始就有一些数据（配置），则添加新记录并显示在网格中没有问题。
但是，如果我让网格在开始时没有数据，则在添加新记录时，商店计数会反映添加情况，但网格仅显示最新添加的记录。
任何关于去哪里寻找的建议将不胜感激。谢谢。
这是代码：
var srGrid = new Ext.grid.GridPanel({
id: 'srGrid',
title: 'Scheduled For',
x: 230,
y: 40,
width: 200,
store: new Ext.data.ArrayStore({
fields: ['index', 'date'],
idIndex: 0,
autoLoad: false
}),
columns: [
{dataIndex: 'date', id: 'srCol', width: 196, menuDisabled: true}
],
listeners: {
beforeshow: function() {
//this.store.removeAll();
}
}
});
var srCustomContentPanel = new Ext.Panel({
id: 'srCustomScheduleContent',
border: false,
layout: 'absolute',
items: [
srGrid,
{
xtype: 'button',
id: 'addButton',
text: 'Add to Scheduled',
handler: function() {
var idx = srGrid.store.getCount()+1;
var newData = {
index: idx,
date: 'tomorrow'+idx
};
//var recId = 3; // provide unique id
var p = new srGrid.store.recordType(newData, idx); // create new record
console.log(p);
srGrid.store.insert(0, p);
},
x: 10,
y: 250
},
]}
);
I have a grid that on load is empty and I want to populate based on a button click.
If the store has some data in to begin with (config), the new records are added and displayed in the grid no problem.
However, if I let the grid with no data in the begining, when adding new records, the store count is reflecting the additions but the grid only ever displays the latest added record.
Any suggestion of where to look would be greatly appreciated. Thank you.
Here is the code:
var srGrid = new Ext.grid.GridPanel({
id: 'srGrid',
title: 'Scheduled For',
x: 230,
y: 40,
width: 200,
store: new Ext.data.ArrayStore({
fields: ['index', 'date'],
idIndex: 0,
autoLoad: false
}),
columns: [
{dataIndex: 'date', id: 'srCol', width: 196, menuDisabled: true}
],
listeners: {
beforeshow: function() {
//this.store.removeAll();
}
}
});
var srCustomContentPanel = new Ext.Panel({
id: 'srCustomScheduleContent',
border: false,
layout: 'absolute',
items: [
srGrid,
{
xtype: 'button',
id: 'addButton',
text: 'Add to Scheduled',
handler: function() {
var idx = srGrid.store.getCount()+1;
var newData = {
index: idx,
date: 'tomorrow'+idx
};
//var recId = 3; // provide unique id
var p = new srGrid.store.recordType(newData, idx); // create new record
console.log(p);
srGrid.store.insert(0, p);
},
x: 10,
y: 250
},
]}
);
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您的代码对我有用： http://jsfiddle.net/sadkinson/rF5TQ/24/
我稍微修改了它以便在 jsfiddle 中渲染。也许这与您使用的
absolute布局有关。您可以使用 FireBug 检查 DOM，看看是否确实添加了其他行，但只是不可见。Your code works for me: http://jsfiddle.net/sadkinson/rF5TQ/24/
I modified it slightly in order to render in jsfiddle. Perhaps it has something to do with the
absolutelayout you are using. You might check the DOM using FireBug and see if there are actually additional rows being added, but just aren't visible.事实证明我忘记提及网格的高度。
autoHeight: true 修复了它。
It turns out that I forgot to mention a height for the grid.
autoHeight: true fixed it.