ExtJS Paging Toolbar start page

Question

I have an ExtJS GridPanel with a store and a paging toolbar at the bottom. I can manually set the start page through the browser using:

www.someurl.com/page/7

This will load the data store with page 7 correctly. However, the paging toolbar does not update the page number from the store (it still shows 1). I was under the impression that by changing the page of the store also changes the page in the paging toolbar, but this is not the case. Here is some example code:

var _store = new Ext.data.Store({
  id          : 'store_id',
  remoteSort  : true,
  autoDestroy : true,
  restful     : true,
  proxy       : _proxy,
  reader      : _reader,
  writer      : _writer
});

var _pagingToolbar = new Ext.PagingToolbar({
  displayInfo    : true,
  pageSize       : 20,
  store          : _store
});

_I.grid = new Ext.ux.GridPanel({
 id             : _I.options.id+'_grid',
 title          : _I.options.title,
 store          : _store,
 bbar        : _pagingToolbar
});


_I.options.page = 7; //start store on page 7

_I.grid.render('somediv');
_store.load({params:{start:_I.options.page, limit:20, sort:'id', dir:'ASC'}});

Since the start page is set to 7, the data that loads in the store is correct, however, the page in the paging toolbar reads 2. I have tried manually setting the page with

_pagingToolbar.changePage(20); // should set page to 20

I get the same result, the data store loads up the correct page, however the toolbar text does not change. Is the order wrong? I also tried loading the store before the grid is rendered, to no avail, with same result.

SW4 SW4 · Accepted Answer · 2010-11-04T09:37:58

As the store and the paging bar are inhernatly linked, you should simply be able to use the .changePage(n) method to change the page and automatically adjust the content of the store. You shouldnt need to also code the store with a recordset update. Also, are you 100% sure the store is displaying the correct records for page '7'?

ExtJS Paging Toolbar start page

2 Answers