Ext.PagingToolbar.bind/unbind

[jbraband]

The constructor of Ext.PagingToolbar stores the passed datastore in a member variable (this.ds). this member variable is used in a couple different places throughout the class (updateInfo(), getPageData(), onPagingKeydown(), onClick()).

the methods bind () and unbind(), although being passed a new reference to a different datastore which will control the data used to configure the paging toolbar, is not resetting the value of the datastore member variable (this.ds). because of this, the paging toolbar will always be referencing the original datastore passed at construction-time.

the fix is simple.


/**
* Unbinds the paging toolbar from the specified {@link Ext.data.Store}
* @param {Ext.data.Store} store The data store to unbind
*/
unbind : function(ds){
ds.un("beforeload", this.beforeLoad, this);
ds.un("load", this.onLoad, this);
ds.un("loadexception", this.onLoadError, this);
this.ds = undefined;
},

/**
* Binds the paging toolbar to the specified {@link Ext.data.Store}
* @param {Ext.data.Store} store The data store to bind
*/
bind : function(ds){
ds.on("beforeload", this.beforeLoad, this);
ds.on("load", this.onLoad, this);
ds.on("loadexception", this.onLoadError, this);
this.ds = ds;
}


i have a file called ExtMods.js that looks like this (it handles all of my Ext overrides and modifications so that I am not modify the distributed Ext source).



Ext.PagingToolbar.prototype.unbind = function(ds){
ds.un("beforeload", this.beforeLoad, this);
ds.un("load", this.onLoad, this);
ds.un("loadexception", this.onLoadError, this);
this.ds = undefined;
};

Ext.PagingToolbar.prototype.bind = function(ds){
ds.on("beforeload", this.beforeLoad, this);
ds.on("load", this.onLoad, this);
ds.on("loadexception", this.onLoadError, this);
this.ds = ds;
}





of course once this makes its way into the distributed source, i will remove it from ExtMods.js and be back to using 100% distributed source.

-j

[waterlowa]

This is impressive... Everytime ds has changed (with a ds.reload(params:params) command) the PagingToolbar shows the correct total number of items but not the page number (shown as NaN).

A stupid question: when do I call your unbind and bind methods?

Thanks you.

[jack.slocum]

Thanks jraband - I put those changes in.

[malkishua]

Though im a little late with this response, there is still another issue with the bind / unbind, if you bind to a datastore and dont relaod it, you will need to manually fire the load event with the lastOptions paramater so the paging toolbar will display correct page info, could you please ad this to the bind?

Ext.PagingToolbar.prototype.bind = function(ds){
ds.on("beforeload", this.beforeLoad, this);
ds.on("load", this.onLoad, this);
ds.on("loadexception", this.onLoadError, this);
this.ds = ds;
this.ds.fireEvent("load", this.ds, [], this.ds.lastOptions);
};

also a beforeload event might be needed for other types of listeners.
Thanks,
-Rob.

[jack.slocum]

It shouldn't implicitly trigger a load event as it could affect other things subscribed to the data store. If you are calling load before bindng it, you should trigger the load outside the toolbar.