How to display data in Label from data store in Sencha Touch

Question

I want to display data that i receive from a data store. One way that i have tried, is to take a text field make it disabled and then set its value with store data. But i don't think it is the correct solution so i am trying to use label instead and I am not getting how it can be done. Can you guys can point me to correct way of doing it.? Any help appreciated .

Thanks, Mehul Makwana.

Answer 1

I recently tried to solve this problem by creating a 'label' form component. I posted about it in a blog article I wrote on Sencha/PhoneGap. Here is the code:

Ext.form.LabelField = function(config){
    Ext.form.LabelField.superclass.constructor.call(this, config);
};

Ext.extend(Ext.form.LabelField, Ext.form.Field,  {
    isField: true,
    value: '',
    renderSelectors: {fieldEl: '.x-form-labelfield'},
    renderTpl: [
       '<tpl if="label">',
           '<div class="x-form-label"><span>{label}</span></div>',
       '</tpl>',
       '<div class="x-form-label x-form-labelfield" style="width:70%; text-align:right"><span>{value}</span></div>',
    ],
    setValue:function(val) {
        this.value = val;
        if(this.rendered){
             this.fieldEl.update('<span>' + val + '</span>');
        }
        return this;
    },

});

Ext.reg('labelfield', Ext.form.LabelField);

Let me know if this does the trick.