javascript - How to call limited number of data while making ajax call in Extjs?

Question

I am currently building an application using Extjs(I am new on this framework). In this framework I have followed MVC architecture. Currently I am working on an ajax calling to define a table grid which displays the records coming from Json File. in my json File I have more then 100 records and I am calling the file on my store which will be as following:

Ext.define('AM.store.Users',{
extend: 'Ext.data.Store',
 model: 'AM.model.User',
 pageSize: 15,
 proxy: {
    type: 'ajax',
    api:{
        read: 'data/users.json',
        update: 'data/updateUsers.json', 
    },
        reader: {
        type: 'json',
        root: 'users',
        successProperty: 'success'
    }
 },
  autoLoad: true,

});

and on my Viewport I have following PagingToolbar

bbar : Ext.create('Ext.PagingToolbar', {
                    displayInfo : true,
                    store:'Users',
                    pageSize: 15,
                    displayMsg : '{0} - {1} of {2}',
                    emptyMsg : "No topics to display"
                })

Before creating the Toolbar i have displayed the grid as following: (it uses the Xtype as I have defined asss alias)

xtype : 'userlist',

As far as My understanding with Extjs this grid should display 15 records at a time and so on and so forth but this grid loads all the records of Json file all at once and gives the pagingtoolbar underneath it. If anyone could help me understand this It would be much more appreciated