CODEWITHSUNDEEP
javascriptextjswidgetextjs5
mhenro
mhenro

Reputation: 61

extjs5 widgetcolumn multiple widgets in a single cell

I create a widgetcolumn as the panel in which several components. How can i link record parameters with these components?

For example:

{
    xtype: 'widgetcolumn',
    dataIndex: 'data',
    widget: {
        xtype: 'panel',
        height: 77,
        width: 642,
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [
            {
                xtype: 'button',
                text: record.get('name')    //<<-- how can i link this record from the grid with this component?
            },
            {
                xtype: 'button',
                text: record.get('type')    //<<-- how can i link this record from the grid with this component?
            },
            {
                xtype: 'button',
                text: record.get('location')    //<<-- how can i link this record from the grid with this component?
            }
        ]
    }
}

I have a following store:

var store = Ext.create('Ext.data.Store', {
     fields:['name', 'type', 'location'],
     data:[
          {name: 'name1', type: 'type1', location: 'loc1'},
          {name: 'name2', type: 'type2', location: 'loc2'}
     ]
});

Maybe, I can get access to the record via renderer function? Something like this:

 renderer: function(value, meta, record) {
    //How can I get access to widget instance?
 }

Upvotes: 0

Views: 1792

Answers (1)

mhenro
mhenro

Reputation: 61

I solved this problem. We need to get access to the parent element - widgetcolumn, and then call the function - getWidgetRecord.

{
xtype: 'label',
text: 'Some text...',
cls: 'gridcall-label-asgmt',
listeners: {
    resize: function(label) {
        var parent = label.up();
        while(typeof parent.up() !== 'undefined') {
            parent = parent.up();
        }   // --- while

        var record = parent.getWidgetRecord();
        if (typeof record === 'undefined') return;

        label.setText(record.data.asgmt, false);
    }   // --- resize
}   // --- listeners

}

Upvotes: 3

Related Questions