1. #1
    Ext JS Premium Member
    Join Date
    Sep 2009
    Posts
    85
    Vote Rating
    0
    HyGy is on a distinguished road

      0  

    Default dynamic column grid inserting to mvc pattern

    dynamic column grid inserting to mvc pattern


    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:
    PHP Code:
    Ext.Ajax.request({
                
    url'data/cd-dashboard.json',
                
    success: function(response){
                    var 
    object Ext.decode(response.responseTextfalse);
                    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',
                
    fieldsfields
            
    });


            
    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 = {
                
    fieldscolumnsFromServer,
                
    model'MYAPP.model.User',
            
    storeId'dashboard',
            
    id'dashboard',

            
    autoLoadtrue,
            
    remoteSorttrue,

            
    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',
                    
    storethis.store,
                            
    displayInfotrue
                
    }
            });

            
    this.callParent(arguments);
        }

        });

                }
            }); 

  2. #2
    Sencha Premium Member
    Join Date
    May 2010
    Location
    Guatemala, Central America
    Posts
    1,310
    Vote Rating
    112
    ssamayoa is just really nice ssamayoa is just really nice ssamayoa is just really nice ssamayoa is just really nice ssamayoa is just really nice

      0  

    Default


    If you don't known about the composition of your view (grid in this case) how do want to manage from a contoller?
    UI: Sencha Architect 3.x / ExtJS 4 & 5
    Server side: JEE / EJB 3.x / CDI / JPA 2.x/ JAX-RS / JasperReports
    Application Server: Glassfish / WildFly
    Databases: Oracle / DB2 / MySQL / Firebird

    If you like my answer please vote!

  3. #3
    Sencha User crysfel's Avatar
    Join Date
    Feb 2008
    Location
    New York, USA
    Posts
    218
    Vote Rating
    8
    crysfel will become famous soon enough

      0  

    Default


    I usually create execute this code in the controller:

    Code:
    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!

  4. #4
    Ext JS Premium Member
    Join Date
    Sep 2009
    Posts
    85
    Vote Rating
    0
    HyGy is on a distinguished road

      0  

    Default


    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!

    Quote Originally Posted by crysfel View Post
    I usually create execute this code in the controller:

    Code:
    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!

  5. #5
    Sencha Premium Member
    Join Date
    Apr 2010
    Posts
    193
    Vote Rating
    24
    elgs will become famous soon enough

      0  

    Default


    Thank you!! Very inspiring!!

Thread Participants: 3

Tags for this Thread