PDA

View Full Version : Help Regarding displaying total records - Grid store



kumar_Rajesh78
26 Nov 2014, 8:38 AM
Hello team,
I would need a help regarding displaying total number of records in the store on the top of the page.
I have a page where on the top I have a form and underneath there is a grid/Store.
I am trying to use store.getTotalCount() and display it on the form.
However, I think when the page is loaded, this value is 0 and only after grid is rendered this value will be accurate.

How shall I update my form back with the correct value after the page is loaded.

Is there a way to do it.

Any help will be highly appreciated.

Thanks,
Rajesh

joel.watson
26 Nov 2014, 10:45 AM
Hello team,
I would need a help regarding displaying total number of records in the store on the top of the page.
I have a page where on the top I have a form and underneath there is a grid/Store.
I am trying to use store.getTotalCount() and display it on the form.
However, I think when the page is loaded, this value is 0 and only after grid is rendered this value will be accurate.

How shall I update my form back with the correct value after the page is loaded.

Is there a way to do it.

Any help will be highly appreciated.

Thanks,
Rajesh

Hi Rajesh--

You should subscribe to the store's load event (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.Store-event-load) (or create a callback in the store's load method (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.Store-method-load), if that's your approach) in order to ensure that the store is loaded with data before trying to get the count. Once you have the count, you should be able to get a reference to the form and update it using the total from the store.

One thing to look out for, though. If you have a paged grid, getCount() may not return the full record count. In this case, you'd want to use getTotalCount (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.Store-method-getTotalCount)(), which will retrieve the total record count which the proxy is informed of in your data response.

Hope that helps!

kumar_Rajesh78
26 Nov 2014, 11:05 AM
Thanks Joel,
I tried to subscribe to the load event as follows. Actually I want to display the total number of records on the grid title bar.
so I have this code. I am listening to the load event in the controller as follows.

Controller:


init: function() {
this.control({
'mystore': {
load: this.onStoreLoad
}
});
},
onStoreLoad : function() {
var grid = Ext.ComponentQuery.query('#myGrid')[0];
var store = coveragegrid.getStore();
console.log(coverageStore.getTotalCount());
console.log(coverageStore.getCount());
coveragegrid.setTitle("FF");
}



Store:

Ext.define('Summaries', {
extend: 'Ext.data.Store',
requires: 'model.Summary',
model: 'model.Summary',
alias: 'widget.mystore',
autoLoad: true,
remoreSort: true,
proxy: {
type:'rest',
api: {
read:'../rest/getDetail'
},
headers: { 'Content-Type': 'application/json'},
actionMethods: {
read: 'GET'
},
reader: {
type: 'json',
root: 'summaryList',
totalProperty: 'total'
}
}

});



The problem is the Grid shows the records fine. But the method onStoreLoad : function() never executes.

joel.watson
26 Nov 2014, 11:33 AM
Hi Rajesh--

In your controller, control (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.app.Controller-method-control)() can only be used for component listeners. For other event domains (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.app.EventDomain), use listen (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.app.Controller-method-listen)() instead:


this.listen({
global: {}, // global domain
controller: {}, // controller domain
direct: {}, // direct domain
store: {
'#mystore': {
load: this.onStoreLoad
}
}, // store domain
component: {
// all listeners from control() can go here in the component domain...
}
});

Hope that helps!