它看起來像GridView的聽衆對商店的「添加」事件未添加到視圖,直至在GridView的init()(這是從電網的onRender()
調用)被調用。網格渲染時會發生這種情況(win.show())。您沒有在#2(插入 - 插入 - 顯示)中發生錯誤,因爲它從未在GridView的processRows()
中碰到Ext.fly(rows[0]).addClass(this.firstRowCls);
。
我改變了代碼一點在GridView的打印出一些日誌init和使用onAdd(處理程序商店的add事件):
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel({
columns: [{
dataIndex: 'common',
editor: new Ext.form.TextField({allowBlank: false})
}]
});
var store = new Ext.data.Store({
reader: new Ext.data.JsonReader({
record: 'plant',
fields: [{name: 'common', type: 'string'}]
})
});
var grid = new Ext.grid.EditorGridPanel({
store: store,
cm: cm,
region: "center",
view: new Ext.grid.GridView({
init : function(grid) {
console.log("\tinit()");
this.grid = grid;
this.initTemplates();
this.initData(grid.store, grid.colModel);
this.initUI(grid);
},
onAdd : function(store, records, index) {
console.log("\t\tadding: ", records[0].id);
this.insertRows(store, index, index + (records.length-1));
}
})
});
var win = new Ext.Window({
layout: "border",
items: [grid],
width : 300,
height : 300
});
var Rec = grid.getStore().recordType;
/*
console.log("show-insert-insert");
win.show();
console.log("\t1st insert");
store.insert(0, new Rec());
console.log("\t2nd insert");
store.insert(0, new Rec());
*/
console.log("insert-insert-show");
console.log("\t1st insert");
store.insert(0, new Rec());
console.log("\t2nd insert");
store.insert(0, new Rec());
console.log("win.show()");
win.show();
});
下面是三種不同的情況下,控制檯:
show-insert-insert
init()
1st insert
adding: ext-record-1
2nd insert
adding: ext-record-2
win.show()
insert-show-insert
1st insert
win.show()
init()
2nd insert
adding: ext-record-2
Ext.fly(rows[0]) is null
[Break On This Error]
Ext.fly(rows[0]).addClass(this.firstRowCls);
ext-all-debug.js (line 43959
insert-insert-show
1st insert
2nd insert
win.show()
init()
正如你可以看到的唯一情況,它實際上將兩個項目添加到網格(和GridView)在show-insert-insert案例中。目前爲止我找到的最佳解決方案只是做
win.show();
win.hide();
在開頭。到目前爲止我還沒有找到更好的解決方案。我希望這有幫助。