PDA

View Full Version : Extended object attributes in button handler



jshailes
25 Aug 2011, 2:52 AM
I'm having real difficulty getting access to a variable that is an attribute of an extended FromPanel from within a button handler on the form. If anyone could offer assistance I'd greatly appreciate it.

Example form where I try to access myAttribute from within the handler of updateUnitsButton:



TrainOverviewPanel = Ext.extend(Ext.FormPanel, {
myAttribute: undefined
,initComponent:function() {
var unitIdField1 = new Ext.form.TextField({
itemId: 'unitIdField1',
flex: 1
});
var unitIdField2 = new Ext.form.TextField({
itemId: 'unitIdField2',
flex: 1
});
var unitIdField3 = new Ext.form.TextField({
itemId: 'unitIdField3',
flex: 1
});
var unitIdFields = new Ext.form.CompositeField({
itemId: 'unitIdFields',
items: [unitIdField1, unitIdField2, unitIdField3],
width: 200
});

var updateUnits = function() {
alert("How can I access attribute: " + this.myAttribute);
}
var updateUnitsButton = new Ext.Button({
tdoId: undefined,
text: 'Update',
handler: updateUnits,
width: 50
});

var updatableUnitIdFields = new Ext.form.CompositeField({
readOnly: false,
fieldLabel: 'Unit ID',
itemId: 'updatableUnitIdFields',
items: [unitIdFields, updateUnitsButton],
width: 300
});

Ext.apply(this, {
width: 450,
height: 130,
margins:'10 0 0 0',
items: [ updatableUnitIdFields ]
});
TrainOverviewPanel.superclass.initComponent.apply(this, arguments);
}

,onRender:function() {
TrainOverviewPanel.superclass.onRender.apply(this, arguments);
}

,refresh: function(data) {
this.myAttribute = data.myAttribute;
var unitIdFields = this.getComponent('updatableUnitIdFields').items.get(0);
unitIdFields.items.get(0).setValue(data.stockId1);
unitIdFields.items.get(1).setValue(data.stockId2);
unitIdFields.items.get(2).setValue(data.stockId3);
}
});

bkraut
26 Aug 2011, 6:36 AM
Why you are not using something like unitIdField1.setValue(value) directly?

drian
29 Aug 2011, 9:54 PM
var updateUnitsButton = new Ext.Button({
tdoId: undefined,
text: 'Update',
handler: updateUnits,
width: 50,
scope: this
});