View Full Version : ComboBox Show event don't work (Ext 4.0.7)

18 Apr 2012, 6:32 PM
i try to use show event of Combobox, but it don't work
this example from docs whith listeners

// The data store containing the list of statesvar
states = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
// Create the combo box, attached to the states data store
Ext.create('Ext.form.ComboBox', {
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
renderTo: Ext.getBody(),
//scope: yourScope,
activate: function() { alert('activate')}, // don't work
show: function() { alert('show')}, // don't work
expand: function() { alert('expand')}, // work
afterrender: function() { alert('afterrender')}, // work

i need this events then combobox use as editor in grid

columns... {header: ... editor: field_edit()}...

function fiel_edit () {
return {
xtype: 'combobox',
triggerAction: 'all',
queryMode: 'local',
store: store,
displayField: 'Name',
valueField: 'ID',
editable: false,
listeners: {
show: function() { alert('show') }, // don't work
beforeshow: function() { alert('beforeshow') }, // don't work
activate: function() { alert('activate') } // don't work

it is expected that the event should be triggered before and during the showing of the combobox

How to tigger this events?
Thanks in advance

19 Apr 2012, 5:09 AM
This event only fires when you manually call someComboInstance.show().

19 Apr 2012, 5:26 AM
friend, how do I change the code to get what I want?

19 Apr 2012, 11:39 AM
I'm not sure exactly what you're trying to do, but if the combo is being used as a grid column's editor component, you might want to take a look at the Ext.grid.plugin.CellEditing (http://docs.sencha.com/ext-js/4-0/#%21/api/Ext.grid.plugin.CellEditing) plugin's beforeedit (http://docs.sencha.com/ext-js/4-0/#%21/api/Ext.grid.plugin.CellEditing-event-beforeedit) event.

19 Apr 2012, 12:40 PM
Activate would work if you had it in a container, but if you are just on the body, then use
beforerender,renderer,after render


19 Apr 2012, 12:48 PM
To elaborate on this ... it seems that 'card' layout will allow this to trigger in a container.

new Ext.container.Container({
renderTo : document.body,
width : 400,
height : 400,
layout : 'card',
items : [
xtype : 'combo',
listeners : {
activate : function() {
console.log('activate fired');


25 Apr 2012, 11:12 PM
I don't know how to use Container in the gridcell and I just override Ext.Editor.startEdit for modify data before show it in the textfeild editor.

Thank you all for your help