PDA

View Full Version : updating select width on label content changed



hulek89
23 Jan 2011, 1:28 PM
hi, how can I update width of a select label, when i change it's content ? cos it stays the same as on creation time, and when i change the label value it's partly cut. i tried doLayout() and do componentLayout() and it ain't work. any ideas? i bet it's real easy....

AndreaCammarata
23 Jan 2011, 3:12 PM
Hi hulek89.
I post you a simple example to show you how to dinamically change a form field according to the select field value



Ext.setup({
onReady: function() {
var myForm = new Ext.Panel({
fullscreen: true,
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'Sample'
}],
items: [{
xtype: 'selectfield',
id: 'cmbSample',
label: 'Label Width',
options: [
{text: 'Option 1 (100px)', value: '100'},
{text: 'Option 2 (500px)', value: '500'}
],
listeners: {
change: function(cmp, value){

//Here i change the label width of txtSurname field according to the selected value
myForm.getComponent('cmbSample').setLabelWidth(value);

}
}
}]
});
}
});
In this way when you change the value of the select field, it's label is changed dynamically with the selected value.

Hope this helps.

hulek89
24 Jan 2011, 4:36 AM
hi, many thanks for your reply, although it's not exaclty waht i'm looking for. i might not have made myself clear on that. what i basically need is a way to detect when label text value is wider than label itself, so i can prevent overflow. i need sth to detect this overflow or a method that'd would redraw control so the text fits the label width? is there any way do to it this way?