[SOLVED] ExtJS: Infinite scrolling not working

ExtJS: Infinite scrolling not working

I am trying to make a grid with Infinite scroll. I followed the example here but when ever I run the app, there is the following error in the console

verticalScroller config is not supported

I am using ExtJS 6.0.1 classic.

Below is my grid and store configuration

Store

Ext.define('Premier.store.MyStore', {
  extend: 'Ext.data.Store',

  alias: 'store.mystore',
  pageSize: 4, // items per page
  buffered: true,
  remoteSort: true,
  remoteFilter: true,

  proxy: {
    type: 'rest',
    url: '/api/MyController',

    reader: {
      type: 'json',
      rootProperty: 'Data',
      idProperty: 'ID',
      totalProperty: 'TotalCount'
    }
  }
});

Grid

{
  xtype: 'grid',
  height: 90,

  columns: [{
    text: 'Name',
    dataIndex: 'Name',
    flex: 1,
    editor: {
      allowBlank: false
    },
    filter: {
      type: 'string'
    }
  }],

  // store: store,
  store: {
    type: 'mystore'
  },

  verticalScroller: {
    xtype: 'paginggridscroller',
    activePrefetch: false
  },

  selModel: 'rowmodel',
  plugins: [{
    ptype: 'rowediting',
    clicksToEdit: 2
  }, {
    ptype: 'gridfilters'
  }]
}

Solution

It appears I was using the wrong Example. I was using an example from ExtJS 4.0.

I followed the example here and it worked fine.