PDA

View Full Version : Label element not firing dblclick event



nagarajan75
28 Mar 2012, 2:11 PM
I have a label component with 'labelTest' as ref. I want to make use of Ext.Editor to edit the label.
The following line "form.labelTest.getEl().on('dblclick', function(e, t){}" does not get called. I do get the element object for the label but dblclick event is not firing. It first for textfield display field and title panel field but not for the label text. Can anybody throw some light what is happening and how do I solve this issue?

Label comp
--------------
{
xtype: 'label',
ref:"labelTest",
text: 'text1',
}

Editor Comp
----------------
var cfg = {
shadow: false,
completeOnEnter: true,
cancelOnEsc: true,
updateEl: true,
ignoreNoChange: true
}, height = form.child('textfield').getHeight();


var labelEditor = Ext.create('Ext.Editor', Ext.apply({
alignment: 'bl-bl?',
width: 100,
height: height,
offsets: [0, 10],
//alignment: 'l-l',
listeners: {
beforecomplete: function(ed, value){
if (value.charAt(value.length - 1) != ':') {
ed.setValue(ed.getValue() + ':');
}
return true;
}
},
field: {
name: 'labelfield',
allowBlank: false,
xtype: 'textfield',
width: 90,
selectOnFocus: true
}
}, cfg));
form.labelTest.getEl().on('dblclick', function(e, t){
labelEditor.startEdit(t);
// Manually focus, since clicking on the label will focus the text field
labelEditor.field.focus(50, true);
}, null, {
delegate: 'label.x-form-item-label'
});

volty
29 Mar 2012, 5:16 AM
May be you can use" id :" instead of "ref :"


{ xtype : 'label',
id : 'labelTest'
}

var labelTest = Ext.getCmp('labelTest');
labelTest.getEl().on('dblclick', function(e, t) {

Ext.Msg.alert(e.type, "Label Test");
});

nagarajan75
29 Mar 2012, 2:23 PM
I don't have any issues in getting the reference for form.labelTest.getEl(). The problem is the event.

volty
29 Mar 2012, 11:42 PM
The ref property doesn't exist that's why you can't retrieve the label element and therefore you can't have any event