extjs Grid is not showing expected data even when store, and colums are present in grid object

Question

I'm new to extjs and I'm having some trouble loading json data to a grid. In the debugger I can see the grid's store and columns are being populated accurately the way I want. But the data is not displaying in the grid. I'm not sure why. But my grid is not loading the data.

What am I doing wrong?

Thank you in advance.

the grid view:

Ext.define('searchadmin.view.reports.DynamicGrid' ,{
    extend: 'Ext.grid.Panel',
    alias : 'widget.dynamicGrid',
    title : 'Results',
    columns: [],
    columnLines : true,
    sortableColumns : false,
    autoScroll : true,
    viewConfig : {
        stripeRows : false,
        loadMask:true       
    }
});

The store:

Ext.define('searchadmin.store.DynamicGridStore', {
    extend : 'Ext.data.Store',
    model: 'searchadmin.model.DynamicGridModel',

    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'data'
        }
    }
});

The model:

Ext.define('searchadmin.model.DynamicGridModel', {
    extend: 'Ext.data.Model',
    fields: []
});

The view config for the page on which the above grid is in this gist: Reports.js

The Reports controller that contains the code to dynamically compose the model and store is in the handleSelectQueryResult() in: ReportsController

Your code in the controller isn't correct. Your "executeReport" function always return undefined, the request hasn't completed yet. You need to execute a callback from the success fn. — Evan Trimboli, Oct 13 '15 at 20:38
@EvanTrimboli - I've updated the controller in the link above quite a bit. In the debugger I can see the grid's store and columns are being populated and everything accurately the way I want. But the data is not displaying in the grid. I'm not sure why. I've updated the Reports.js view as well. Please see if you can help why the grid is still not rendering. You can view the updated code in the links above. I'm using extjs 4.2.1 — Horse Voice, Oct 13 '15 at 22:34
As far as I can see the problem is still there. `executeReport` will always return `undefined`. http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call — Evan Trimboli, Oct 13 '15 at 22:38
@EvanTrimboli - hangon a sec. Are you looking at the updated link? I think you may have caught the old file in github. I checked the link and now it's showing the new file. In `executeReport()` I'm invoking the method `handleSelectQueryResult()`. And inside this method is where I'm populating the store and updating the grids columns attribute and loading the store. — Horse Voice, Oct 13 '15 at 22:45
1) `Ext.ComponentQuery.query` returns an array. 2) You can't just assign properties like that, you need to call the `reconfigure` method. — Evan Trimboli, Oct 14 '15 at 00:15
@EvanTrimboli Could you please elaborate how that would be done? Reconfigure on the grid? An example on this would be divine right about now! Thank you! — Horse Voice, Oct 14 '15 at 03:37

Gilsha · Accepted Answer · 2015-10-14T04:14:01.237

1

You will have to use reconfigure method of grid instead of just assigning columns and store like this in handleSelectQueryResult function of ReportsController.js.

 grid.columns = _columns; //will not work
 grid.store = queryStore; //will not work

Also note that ComponentQuery.query returns an array.

Try this way.

var grid = Ext.ComponentQuery.query('#dynamicGridId')[0]; //or var grid = Ext.getCmp('dynamicGridId');
grid.reconfigure(queryStore, _columns);

edited Oct 14 '15 at 04:14

answered Oct 14 '15 at 04:07

Gilsha

14,431
3
32
47

Thank you so much!! do you know if there is a way to buffer the grid so that it doesn't show the whole thing in the panel? Pagination would help. – Horse Voice Oct 14 '15 at 13:59
You can use pagination or buffered store. Refer here http://dev.sencha.com/ext/5.1.0/examples/grid/buffered-store.html – Gilsha Oct 14 '15 at 14:14

extjs Grid is not showing expected data even when store, and colums are present in grid object

1 Answers1