O'Reilly logo

Learning Ext JS 4 by Armando Gonzalez, Crysfel Villa

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Infinite scrolling

If we don't like the pagingToolbar item, Ext JS 4 introduces a new type of grid, the infinite scrolling grid. This grid can render thousands of records without needing the pagingToolbar item. The grid should be bound to a store with a pageSize property that will load data dynamically according to the pageSize property.

Let's see an infinite scrolling example. First we need to add some configuration to our store:

Ext.create('Ext.data.Store', {
  autoLoad:true,
  model:'Client',
  pageSize:100, //step 1
  purgePageCount:0, //step 2
  proxy:{
type:'ajax',
url:'clients.json',
reader:{
type:'json',
root:'data'
            }
        }
    });

In our previous store configuration, we declared a pageSize property of 100 and set the purgePageCount property to 0. Setting ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required