ExtJS4 - Grid Store pageSize

Question

I am trying to limit pageSize to store 1. I have 10 elements in the grid, and while the search engine correctly shows 1 out of 10, 2 out of 10, etc., the grid still displays all 10 elements. I also tried returning the "total" value to 1 in json, but this still doesn't work. Any ideas?

The example in the documentation is not very useful as it shows the source code, but the real-time preview is empty.

var photos = new Ext.data.Store({ model: 'Photos', autoLoad: true, pageSize: 1 }); var photosGrid = Ext.create('Ext.grid.Panel', { id: 'PhotoGrid', store: photos, columns: [ { text: "Filename", width: 200, dataIndex: 'filename' } ], dockedItems: [{ xtype: 'pagingtoolbar', store: photos, dock: 'bottom', displayInfo: true }], region: 'center', border: 0, overCls: 'row-pointer' }); 

Answer 1

Hey, well, the problem is that you are probably returning all 10 elements in json. The swap you need to implement, everything that paging does, causes it to load into the repository with certain parameters, such as the page limit and the index of the beginning of the page. You must use these options on the server to send one item at a time. Chers mate.

EDIT

 //this is the model we will be using in the store Ext.define('Page', { extend: 'Ext.data.Model', fields: [ {name: 'id', type: 'int'}, ] }); var data = null; var store = null; Ext.Ajax.request({ url: 'someurl', success: function(result){ data = Ext.decode(result.responseText); store = Ext.create('Ext.data.Store', { autoLoad: true, model: 'Page', pageSize: 1, data : data, proxy: { type: 'memory', reader: { type: 'json', root: 'pages'//this has to be as the root from your json } } }); } }); 

Answer 2

This is a query problem in your json formatting script. When you use extjs with pageSize, it sends requests with parameters ( page and limit , I remember). On the server side of the script, you should check to see if they exist, and if so, modify your request to add a limit clause (or equivalent in other databases).