Skip to main content

ExtJS - rendering grid-column after store is loaded

Category: Shopware
shopware-logo

If you want to render a grid column after a specific store is loaded you could do it the following way:

Ext.define('Shopware.apps.MyPlugin.view.list.MyPlugin', {
    extend: 'Shopware.grid.Panel',
    alias:  'widget.my-plugin-listing-grid',
    region: 'center',
    listeners: {
        boxready: function()
        {
            var me = this;

            // gettin' the store
            var store = Ext.create('Shopware.apps.Base.store.Article').load();

            // wait till store is loaded
            store.on('load', function()
            {
                // get columns
                var columns = me.headerCt.getGridColumns();

                // iterate grid columns 
                Ext.each(columns, function(column, index)
                {
                    // get specific column by dataIndex 
                    if(column.dataIndex == 'articleId') {
                        column.renderer = function(value)
                        {
                            // get corresponding record from store
                            var record = store.findRecord('id', value);
                            if(record) return record.data.name;
                        }

                        me.getView().refresh();
                    }
                });
            });
        }
    },
    ...