Results 1 to 3 of 3

Thread: Create store in controller, pass it to views

  1. #1
    Sencha User
    Join Date
    Aug 2012
    Posts
    92
    Answers
    6

    Default Answered: Create store in controller, pass it to views

    Hey all,
    I have a function (createStore) which creates a store based on an existing hardcoded store. I used to have this function defined in several of my views and call this.createStore() in each one. I want to optimize my code and call createStore only once in my controller and pass the resulting store to my views.

    I am using the reconfigure method for my grid to change the store from the controller init function. Firebug is telling me reconfigure is not a function for the variable referencing my grid

    Here is my controller code:
    Code:
    Ext.define('C.controller.Chart', {
            extend: 'Ext.app.Controller',
            models: [ 'Chart' ],
            stores: [ 'Chart' ],
            views: [
                    'chart.Panel',
                    'chart.Chart',
                    'chart.Grid',
                    'chart.GridOrig',
                    'chart.BarChart'
            ],
            init: function(){
                    var store = this.createStore();
                    var grid = Ext.ComponentQuery.query('chartgrid');
                    grid.reconfigure(store);
            }
            createStore:function(){
                    var store = Ext.data.StoreManager.lookup('Chart');
                    store.group('level');
                    var groups = store.getGroups();
                    // create new store basing on groups array
                    var groupStore = Ext.create('Ext.data.Store', {
                            model: 'C.model.GroupChart',
                            fields: [{
                                    name:'level', mapping: 'name'
                            }, {
                                    name: 'total', convert: function(value, record){
                                            return record.raw.children.length;
                                    }
                            }],
                            data: groups
                    });
            return groupStore;
            },
    });
    Here is the code from one of my views (a grid):
    Code:
    Ext.define('C.view.chart.Grid', {
            extend: 'Ext.grid.Panel',
            alias: 'widget.chartgrid',
            height: 400,
            width: 300,
            autoScroll: 'true',
            features:[{
                    ftype: 'grouping'
            }],
            initComponent: function(){
                    //this.store = this.createStore();
                    this.columns=[
                            {header: 'Level',      dataIndex: 'level',      width:75},
                            {header: 'Total',       dataIndex: 'total',     width:75},
                    ];
                    this.callParent(arguments);
            }
    });
    thanks for any tips

  2. Your problem maybe due to you refer to grid component before it is rendered. Try to fix your code as below:
    Code:
    Ext.define('C.controller.Chart', {
        ...
        init: function(){
            //var store = this.createStore();
            //var grid = Ext.ComponentQuery.query('chartgrid');
            //grid.reconfigure(store);
            var me = this;
            me.control({
                'chartgrid': {
                    render: function(grid){
                        grid.reconfigure(me.createStore());
                    }
                }
            });
        }

  3. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Your problem maybe due to you refer to grid component before it is rendered. Try to fix your code as below:
    Code:
    Ext.define('C.controller.Chart', {
        ...
        init: function(){
            //var store = this.createStore();
            //var grid = Ext.ComponentQuery.query('chartgrid');
            //grid.reconfigure(store);
            var me = this;
            me.control({
                'chartgrid': {
                    render: function(grid){
                        grid.reconfigure(me.createStore());
                    }
                }
            });
        }

  4. #3
    Sencha User
    Join Date
    Aug 2012
    Posts
    92
    Answers
    6

    Default

    that seems to have done the trick, thank you very much!

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •