我正在使用Ext.define()(Ext v4)扩展GridPanel。
我需要在双击网格行时获取行数据。在这一点上,我甚至无法让事件监听器工作:
Ext.define('Application.usersGrid', {
extend: 'Ext.grid.GridPanel',
alias: 'widget.usersgrid',
viewConfig: {
listeners: {
dblclick: function(dataview, index, item, e) {
alert('dblclick');
}
}
},
...
这里有什么问题?
如果有人需要答案 - 这是正确的方法:
Ext.define('Application.usersGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.usersgrid',
viewConfig: {
listeners: {
itemdblclick: function(dataview, record, item, index, e) {
alert('itemdblclick');
}
}
},
...
http://dev.sencha.com/new/ext-js/4-0/api/Ext.grid.GridView#event-itemdblclick
答案 0 :(得分:24)
您无需将侦听器放在viewconfig中。这是我的工作配置:
listeners : {
itemdblclick: function(dv, record, item, index, e) {
alert('working');
}
},
另一件事是,您似乎在extend属性中使用了Ext.grid.GridPanel
。但在文档中它是Ext.grid.Panel
。但即使使用gridpanel,一切似乎都运行良好。
我建议使用Ext JS 4术语,因为它可能会导致其他4.x版本中的应用程序破坏。
现在,如果您正在使用新的MVC架构,则需要将这些操作移动到控制器而不是视图。有关详细信息,请参阅MVC架构指南。
答案 1 :(得分:2)
使用ExtJS 4中的MVC方法,还有另一种智能方法来定义这样的处理程序。一些示例代码:
Ext.define('App.controller.Documents', {
extend: 'Ext.app.Controller',
stores: ['Documents'],
models: ['Document'],
views: [
'document.List',
'document.Edit',
'document.Preview'
],
init: function() {
this.control({
/*
* a cool way to select stuff in ExtJS 4
*/
'documentlist': {
itemdblclick: this.editDocument
},
/*
* simple access to components
*/
'documentedit button[action=save]': {
click: this.updateDocument
},
});
},
editDocument: function(grid, record) {
var view = Ext.widget('documentedit');
view.down('form').loadRecord(record);
},
updateDocument: function(button) {
var win = button.up('window'), // new selection API
form = win.down('form'), // in ExtJS 4
record = form.getRecord(),
values = form.getValues();
record.set(values);
win.close();
}
});
答案 2 :(得分:0)
listeners: {
select: 'xxxx',
itemdblclick: function (dv, record, item, index, e) {
var myBtn = Ext.getCmp('btnEdit');
myBtn.onClick();
}
},