PDA

View Full Version : Newbie - How to get/set text for label



hasran
3 Jan 2012, 8:42 PM
Hi,

I am a new to ext4js. I have problem of setting/getting text for item xtype:'label'. I would like to do somethig like grid-form example but instead using label. Some sample code.


var locationList = win.child('gridpanel').getSelectionModel();
win.child('label').setText('Hello'); // this work but need to update on specific label

locationList.on('selectionchange', function(sm, selectedRecord) {
if (selectedRecord.length) {
*** need to update label text here ***
// alert("XX");
// Ext.Element.getById('locationID').setText(selectedRecord[0].data.id);
//alert(selectedRecord[0].data.id);
// alert(selectedRecord[1].data.description);
}
});


Please help...

skirtle
3 Jan 2012, 10:41 PM
Setting the text is just a call to setText:

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Label-method-setText

There is no getter but you can get the current text via either the text or the html property of the label, depending on whether or not the text was HTML encoded last time it was set.

Take a look at the source code, there isn't much to it:

http://docs.sencha.com/ext-js/4-0/source/Label2.html

I wonder whether what you're actually asking is how to get a reference to the label so that you can call setText? That's a much more difficult question to answer as there's not enough information in your question. It's just like in any other OO environment, the question 'how do I get a reference to my object?' is a pretty open-ended question. Component queries will probably be part of it.

hasran
4 Jan 2012, 7:04 PM
Thanks a lot for the reply. But, how to do setText for specific label item as code sample below :


{
xtype: 'label',
id : 'label1'
height: 20,
width: 20,
text: ':',
x: 100,
y: 180
},
{
xtype: 'label',
height: 20,
width: 150,
id : 'label2'
text: 'None',
x: 120,
y: 180
}


How to setText for label with id = 'label2'? Thanks a lot.

hasran
4 Jan 2012, 7:33 PM
Hi. I got it. I use


Ext.getCmp('label2').setText('Hello');

I works. Thanks a lot.

skirtle
4 Jan 2012, 7:41 PM
Please use [CODE] tags for posting code, not [QUOTE] tags.

The use of static ids with Ext.getCmp is highly discouraged. Obtaining a reference to the relevant label is dependent upon its wider role in the app and the context from which you need to obtain it. From what little information we have it's impossible to give a good recommendation but as I've already mentioned it seems likely that component queries will form a part of it.

This isn't so much an ExtJS question as one about the design of your application and the dependencies between your objects. The use of Ext.getCmp is effectively resorting to a global variable.

hasran
4 Jan 2012, 7:49 PM
Thanks Skirtle. At least for now, it solves my problem. But as I go along with Ext4JS developlement I definitely find an efficient way of doing ext way. I have tried using something like :


form.child('label').Id('label2').setText('Hello')

with no luck.

Thanks anyway.

skirtle
4 Jan 2012, 7:54 PM
It would be something like this:


form.child('label[id=label2]').setText('Hello')

That isn't much better though as it still relies on a static id with all the potential problems that can cause.

One trick you see used sometimes is to add an arbitrary property to a component's config purely for CQ purposes. Like this:


{
xtype: 'label',
someMadeUpPropertyName: 'nameLabel',
...
}

Then you can do this:


form.child('label[someMadeUpPropertyName=nameLabel]').setText('Hello')

hasran
4 Jan 2012, 8:04 PM
It works as per your suggestion which is much better than using global and static id. Thanks lot for your help.

StutiAwasthi
19 Dec 2012, 5:48 AM
I am having the same problem. I want to change the Header of a column.
I tried something like:



grid.getCmp('value').setText("Yahooooo!!");

where value is the id of a column.

but it throws an error, object doesn't support this property or method.

Any suggestions ??