View Full Version : MVC and sliding pager

31 Oct 2012, 6:03 AM
I am using mvc to create a tabbed grid with a sliding pager on the bottom bar. My problem is: I can not click on the sliding pager. I am stuck on the first page. Attached you will find my code, Please tell me what I am doing wrong:


name: 'AM',
appFolder: 'app',
controllers: ['TabsController'],
requires: [
launch: function() {


Here is what my controller looks like(models,stores,views list emptied ):

Ext.define('AM.controller.TabsController', {
extend: 'Ext.app.Controller',
models: [..],
stores: [...],
views: [...],

init: function() {
Ext.create('Ext.tab.Panel', {
//layout: 'fit',
height: 700,
width: 620,

activeTab: 0,
items: [
{xtype: 'one'},
{xtype: 'two'},
{xtype: 'three'},
{xtype: 'four'}
//bbar: Ext.create('Ext.toobar.Paging', {
bbar : {
pageSize: 50,
store: this.stores,
displayInfo: true,
plugins: Ext.create('Ext.ux.SlidingPager', {})
renderTo: document.body

Here is a picture of what the bottom bar looks like:

2 Nov 2012, 6:12 AM
Paging toolbar is meant to work with one store but looks like you are giving it one store.

2 Nov 2012, 9:44 AM
ok... I was hoping
store: this.storeswill work. Clearly it doesn't.
Is there a way to make this work?
I tried adding all the stores (below)and it only worked for the first store.

store: 'store1',
store: 'store2',

2 Nov 2012, 10:48 AM
Of course it only worked for the last store given, properties of an object must be unique and last one will overwrite any that come before.