dynamic column grid inserting to mvc pattern

[HyGy]

Hello!

I need a dynamic json configurable column grid. I made one outside my project, what is the good way to insert it to MVC architecture?

This is the code:

Ext.Ajax.request({
            url: 'data/cd-dashboard.json',
            success: function(response){
                var object = Ext.decode(response.responseText, false);
                var columnsFromServer = object.columns;

                var columns = [];
                var fields = [];

        Ext.each(columnsFromServer, function(column){
                    fields.push(column.dataIndex);
                });


        Ext.define('MYAPP.model.User', {
            extend: 'Ext.data.Model',
            fields: fields
        });


        Ext.define('MYAPP.view.general.DynamicColumnsGrid', {
            extend: 'Ext.grid.Panel',
            alias: 'widget.dynamiccolumnsgrid',
    requires: [
        'Ext.grid.column.Action',
        'Ext.toolbar.Paging'
        ],
    

    initComponent: function() {

            var me = this;

        this.store = {
            fields: columnsFromServer,
            model: 'MYAPP.model.User',
        storeId: 'dashboard',
        id: 'dashboard',

        autoLoad: true,
        remoteSort: true,

        sorters: [
              {
                  property : 'organization',
                  direction: 'DESC'
              } ],

        proxy: {
            type: 'ajax',
            url: 'data/users.json',
            reader: {
                type: 'json',
                root: 'data',
                successProperty: 'success'
            }
        }

        };

        this.columns = columnsFromServer;

        Ext.apply(this, {
            bbar: {
                xtype: 'pagingtoolbar',
                store: this.store,
                        displayInfo: true
            }
        });

        this.callParent(arguments);
    }

    });

            }
        }); 

[ssamayoa]

If you don't known about the composition of your view (grid in this case) how do want to manage from a contoller?

[crysfel]

I usually create execute this code in the controller:

Ext.each(columnsFromServer, function(column){
                    fields.push(column.dataIndex);
                });


        Ext.define('MYAPP.model.User', {
            extend: 'Ext.data.Model',
            fields: fields
        });

And then create an instance of the view with the dynamic store and fields.

Cheers!

[HyGy]

Can U give me a more detailed example how you think this?

When I make a grid in a normal way, it says the model is missing...

If I make an empty model, I cant reconfigure it.

Thanks!

I usually create execute this code in the controller:

Ext.each(columnsFromServer, function(column){
                    fields.push(column.dataIndex);
                });


        Ext.define('MYAPP.model.User', {
            extend: 'Ext.data.Model',
            fields: fields
        });

And then create an instance of the view with the dynamic store and fields.

Cheers!

[elgs]

Thank you!! Very inspiring!!