View Full Version : Add dynamic refresh event on gridpanel

15 Feb 2013, 2:47 AM

I would like to add a refresh event on my gridpanel so that I can handle a paging toolbar use on that gridpanel.

I know the refresh event is fired on the (grid)view.

I try

_myGridPanel.getView().on('refresh', function(view, eopts){ <code> })

but it doesn't work when the gridpanel content is loaded / changed.

Any idea ?

Thanks for all

15 Feb 2013, 4:02 AM
Actually this code works for me:


What version of Ext do you use?

15 Feb 2013, 5:27 AM

It's 4.1.3

I do something like

console.log('Refreshed !');


with _pagingToolbar acting on the store displayed by the _masterList gridPanel.

But - maybe is it the reason of my problem - the _masterList is not displayed at that time. It's in my card layout, but not displayed.

The scenario is the following one: I have a gridPanel (_masterList) with a paging toolbar managing it. I go on the last record of the current page of that gridPanel. I double-click on it to enter the "form view" of that row.

This "form view" is another panel. But the _masterList gridPanel is still managed by my Card layout.

In the view form, I click on the "next" button. That means "Switch to next list record in the form view". Because I was on the last row of my _masterList, I have to change the paging current page and select the first row of the next page.

But, how to know that first row of the next page ? The only solution I see is to wait the gridPanel is refreshed.

But the 'refresh' event seems not to be triggered.

Why ?

Is there another solution ?

Thanks for all !

18 Feb 2013, 6:19 AM

Maybe my problem is that I use a viewConfig.

When I directly add a generic listener on 'refresh' in the gridPanel viewConfig, it works. I see it in the console log.

But when I want to (and I need to) add it dynamically to the viewConfig, I get an error.

Why must the event be on the ViewConfig ?

How to add a dynamic listener on a viewConfig object ?

Thanks for all.

20 Feb 2013, 3:49 AM
Hello !

I'm still on that problem. But I think I discovered what happens, without understanding it.

I created a custom class

Ext.define('fwkLayout.view.NtkGridPanel', {
extend: 'Ext.grid.Panel',
alias: 'widget.NtkGridPanel'


initComponent: function() {
this._pendingAction = '';
this.getView().on('refresh', this.onRefresh, this);

In my tabPanel, I add an instance of that custom NtkGridPanel with

Ext.applyIf(me, {
items: [
xtype: 'NtkGridPanel',
id: 'appAccountLVGridPanel',

viewConfig: {
emptyText: 'No data found for this filter...',
stripeRows: false

As columns of that grid panel, I have a first "action column" and lots of another columns.

When I click on the event that refreshes the view, I see that _myGridPanel.getView() returns an object having the right 'appAccountLVGridPanel' Id, and the right listener on 'refresh' event, the onRefresh() I defined here above, ok !

But, when the page refreshes on screen, only two views trigger the 'refresh' event

- a first one for the "action" column
- a second one covering all the other columns

each of these views have the right viewConfig emptyText: 'No data found for this filter...' I defined when I created my tabPanel.

But they have random Id and they use standard listeners, not the one I defined on my custom gridPanel.

Why ?

Could someone explain it to me ?

Thanks in advance