Как добавить прослушиватель событий двойного щелчка строки при расширении сетки с помощью Ext.define()?
Я расширяю GridPanel с помощью Ext.define() (Ext v4).
Мне нужно получить данные о строках, когда строка сетки дважды нажата. В этот момент я даже не могу заставить слушателя событий работать:
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
Ответы
Ответ 1
Вам не нужно помещать слушателя в viewconfig. Вот моя рабочая конфигурация:
listeners : {
itemdblclick: function(dv, record, item, index, e) {
alert('working');
}
},
Другое дело, вы, кажется, использовали Ext.grid.GridPanel
в свойстве extend. Но в документации это Ext.grid.Panel
. Но даже с gridpanel все работает нормально.
Я бы предложил использовать термины Ext JS 4, поскольку это может привести к поломке приложения позже в других версиях 4.x.
Теперь, если вы используете новую архитектуру MVC, вам нужно будет перенести эти действия на контроллер, а не на представление. Подробнее см. Руководство по архитектуре MVC.
Ответ 2
В подходе MVC в ExtJS 4 есть еще один умный способ определения таких обработчиков. Пример кода:
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();
}
});
Ответ 3
listeners: {
select: 'xxxx',
itemdblclick: function (dv, record, item, index, e) {
var myBtn = Ext.getCmp('btnEdit');
myBtn.onClick();
}
},