如何在extjs中正确地将rowediting和rowexpander结合在一起?
我正在ExtJS中开发一个Web应用程序。 该应用程序是一个grid
,其中一些grid
的行可以展开以显示作为嵌套网格的补充信息。 用户可以编辑父网格中的行。
但我有问题。 嵌套grid
通常呈现,但是当我想更新字段嵌套网格之一消失。
有我的应用程序和一些屏幕截图的测试版本。
代码 (下面你可以找到屏幕)
Ext.onReady(function() {
Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
data: {
'items': [{
'name': 'Lisa',
"email": "lisa@simpsons.com",
"phone": "555-111-1224"
},
{
'name': 'Bart',
"email": "bart@simpsons.com",
"phone": "555-222-1234"
},
{
'name': 'Homer',
"email": "home@simpsons.com",
"phone": "555-222-1244"
},
{
'name': 'Marge',
"email": "marge@simpsons.com",
"phone": "555-222-1254"
}
]
},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
plugins: [{
ptype: 'rowexpander',
pluginId: 'courseListGridExpander',
expandOnDblClick: false,
selectRowOnExpand: false,
enableCaching: false,
rowBodyTpl: ['']
},
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToMoveEditor: 2,
autoCancel: false
})
],
viewConfig: {
listeners: {
expandbody: function(rowNode, record, expandbody) {
var targetId = 'SessionInstructionGridRow';
if (Ext.getCmp(targetId + "_grid") == null) {
var sessionInstructionGrid = Ext.create('Ext.grid.Panel', {
renderTo: targetId,
id: targetId + "_grid",
title: 'Nested One',
columns: [{
header: 'Halo',
flex: 1
},
{
header: 'Halo 2',
flex: 1
}
]
});
rowNode.grid = sessionInstructionGrid;
sessionInstructionGrid.getEl().swallowEvent(['mouseover', 'mousedown', 'click', 'dblclick', 'onRowFocus']);
sessionInstructionGrid.fireEvent("bind", sessionInstructionGrid, {
ClientSessionId: record.get('ClientSessionId')
});
}
},
celldblclick: function(gr, td, cellIndex, record) {
//alert("@@@");
}
}
},
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [{
text: 'Name',
dataIndex: 'name',
editor: {
allowBlank: false
}
},
{
text: 'Email',
dataIndex: 'email',
flex: 1
},
{
text: 'Phone',
dataIndex: 'phone'
}
],
height: 200,
width: 400,
renderTo: Ext.getBody()
});
Ext.create('Ext.button.Button', {
text: 'Hello',
handler: function() {
}
})
});
我会尝试使用ComponentRowExpander插件。 它的目的是在rowexpander中插入任何组件 - 所以它也应该与网格一起工作。
链接地址: http://www.djcxy.com/p/67645.html上一篇: How to combine rowediting and rowexpander together correctly in extjs?