Ext.JS-网格不加载存储值

Question

I have a STORE which is as follows:

Ext.define('Bcks.store.SeriBaskiStore', {
            extend : 'Ext.data.Store',
            storeId : 'seriBaskiStore',
            alias : 'widget.seribaskistore',
            model : 'Bcks.model.SeriBaskiModel',
            remoteSortFilterUseMapping : true,
            pageSize : 25,
            proxy : {
                type : 'ajax',
                api : {
                    read : 'seriBaski/getSeriBaski.json',
                    create : 'seriBaski/saveSeriBaski.json',
                    update : 'seriBaski/updateSeriBaski.json',
                    destroy : 'seriBaski/removeSeriBaski.json'
                },
                writer : {
                    type : 'json',
                    allowSingle : false
                }
            },
            resetSorters : function() {
                var sorters = [{
                            property : 'baskiTarihi',
                            direction : 'ASC'
                        }];
                this.sorters.clear();
                this.sorters.addAll(this.decodeSorters(sorters));
            }
        });

When I do a GET request on seriBaski/getSeriBaski.json I retrieve a dataset as follows:

{"total":10,"data":[{"seriBaskiId":-31,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"1","aciklama":"Tacir","aciklama2":"TACİR","objectValue":"1"},"siparisListesi":null,"version":0},{"seriBaskiId":-32,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"1","aciklama":"Tacir","aciklama2":"TACİR","objectValue":"1"},"siparisListesi":null,"version":0},{"seriBaskiId":-33,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"3","aciklama":"Tacir-Hamiline","aciklama2":"TACİR-HAMİLİNE","objectValue":"3"},"siparisListesi":null,"version":0},{"seriBaskiId":-34,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"4","aciklama":"Tacir Olmayan-Hamiline","aciklama2":"TACİR OLMAYAN-HAMİLİNE","objectValue":"4"},"siparisListesi":null,"version":0},{"seriBaskiId":-35,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"1","aciklama":"Tacir","aciklama2":"TACİR","objectValue":"1"},"siparisListesi":null,"version":0},{"seriBaskiId":-36,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"2","aciklama":"Tacir Olmayan","aciklama2":"TACİR OLMAYAN","objectValue":"2"},"siparisListesi":null,"version":0},{"seriBaskiId":-37,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"3","aciklama":"Tacir-Hamiline","aciklama2":"TACİR-HAMİLİNE","objectValue":"3"},"siparisListesi":null,"version":0},{"seriBaskiId":-38,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"4","aciklama":"Tacir Olmayan-Hamiline","aciklama2":"TACİR OLMAYAN-HAMİLİNE","objectValue":"4"},"siparisListesi":null,"version":0},{"seriBaskiId":-39,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"1","aciklama":"Tacir","aciklama2":"TACİR","objectValue":"1"},"siparisListesi":null,"version":0},{"seriBaskiId":-40,"baskiTarihi":"25/06/2016","baskiSekli":{"value":"2","aciklama":"Tacir Olmayan","aciklama2":"TACİR OLMAYAN","objectValue":"2"},"siparisListesi":null,"version":0}],"success":true}

I have a PANEL which includes a GRID.

Ext.define('Bcks.view.panel.SeriBaskiPanel', {
            extend : 'Ext.panel.Panel',
            alias : 'widget.seribaskipanel',
            title : 'Seri Baski Paneli',
            titleAlign : 'center',
            layout : 'border',

            items : [{
                        xtype : 'seribaskigrid',
                        name : 'seriBaskiGrid',
                        title : 'Seri Baski Tablosu',
                        fitToFrame : true,
                        region : 'center',
                        split : true,
                        flex : 1,
                        selectionOlsun : true,
                        filtreOlsun : true,
                        pdfHidden : false
                    }],

            initComponent : function() {
                console.warn(this.id, " yüklendi (initComponent)");
                this.callParent(arguments);
            }
        });

On my CONTROLLER I try to retrieve the store content as follows:

Ext.define('Bcks.controller.SeriBaskiController', {
    extend : 'Ext.app.Controller',
    models : ['SeriBaskiModel'],
    stores : ['SeriBaskiStore'],
    views : ['panel.SeriBaskiPanel', 'grid.SeriBaskiGrid'],

    refs : [ {
        ref : 'seriBaskiPanel',
        selector : 'seribaskipanel'
    }, {
        ref : 'seriBaskiGrid',
        selector : 'seribaskipanel > seribaskigrid[name=seriBaskiGrid]'
    } ],

    init : function() {
        this.control({
            'seribaskipanel' : {
                'beforerender' : this.beforeRenderSeriBaskiPanel,
                'activate' : this.onPageStartSeriBaskiPanel,
                'deactivate' :  this.onPageEndSeriBaskiPanel
            },
            'seribaskipanel > seribaskigrid[name=seriBaskiGrid]' : {
                'beforerender' : this.beforeRenderSeriBaskiGrid
            }
        });
    },

    beforeRenderSeriBaskiPanel : function(tabpanel, newCard, oldCard) {
    },
    onPageStartSeriBaskiPanel : function(panel, eopts) {
        console.start(arguments);

        var grid = panel.down('seribaskigrid');

        console.log("SERİ BASKI GRID ", grid);

        var store = grid.store.load();

        store.currentPage = 1;
        console.end(arguments);
    },
    onPageEndSeriBaskiPanel : function() {
    },
    beforeRenderSeriBaskiGrid : function(grid) {
        console.start(arguments);
        var me = this, store = Ext.create('Bcks.store.SeriBaskiStore', {
                    storeId : 'mySeriBaskiGrid'
                });
        store.on('beforeload', me.beforeLoadKurumTahsilat, this);
        if (Ext.isNNDefined(grid.down('pagingtoolbar'))) {
            grid.down('pagingtoolbar').bindStore(store);
        }
        grid.reconfigure(store);
        console.end(arguments);
    },
    beforeLoadKurumTahsilat : function(st, op, opt) {
        console.start(arguments);
        var me = this, ep = st.proxy.extraParams;
        console.end(arguments);
    }

});

However, console.log("SERİ BASKI GRID ", grid); returns an empty store. Any ideas on how to retrieve store content from the grid?

Answer 1

There are different ways by which you can get grid reference and the store

1) By using itemId

{
                    xtype : 'seribaskigrid',
                    itemId:'seribaskigridItem',
                    name : 'seriBaskiGrid',
                    title : 'Seri Baski Tablosu',
                    fitToFrame : true,
                    region : 'center',
                    split : true,
                    flex : 1,
                    selectionOlsun : true,
                    filtreOlsun : true,
                    pdfHidden : false
                }

var grid = Ext.ComponentQuery.query('#seribaskigridItem')[0];
grid.getStore();

2) var grid = panel.down('grid');

3)If your selector is fine , you can use:

this.getSeriBaskiGrid().getStore();