PDA

View Full Version : Paging not working, Extjs grid



ealsei
4 Nov 2013, 3:34 AM
I made an extjs grid with a bottom toolbar to create a paging behavior, but it's not working and I don't know where is the problem, I've already done it with local data, but when i used a database it didn't work, it shows all the data at once.
Here's the code :


Ext.require([ 'Ext.data.*', 'Ext.grid.*' ]);


Ext.onReady(function() {
var categoriesStore = Ext.create('Ext.data.JsonStore', {
autoLoad: true,
pageSize : 10,
proxy: {
type: 'ajax',
url: 'GridDataBase/categories.php',
reader: {
type: 'json',
totalProperty: 'total',
root: 'categories',
idProperty: 'name'
}
},
fields : ['id','name']
});


var panelOfData = Ext.create('Ext.grid.GridPanel',{
store : categoriesStore,
columns : [ {
id : 'id',
header : "Id",
width : 20,
sortable : true,
dataIndex : 'id'
}, {
id : 'name',
header : "Category Name",
width : 75,
sortable : true,
dataIndex : 'name'
} ],
//stripeRows : true,


//paging bar on the bottom
bbar: Ext.create('Ext.PagingToolbar', {
store: categoriesStore,
displayInfo: true,
displayMsg: '{0} - {1} of {2}',
emptyMsg: "No categories to display"
}),
autoExpandColumn : 'name',
height : 350,
width : 600,
renderTo : 'grid-ex',
title : 'Categories'
});


categoriesStore.loadPage(1);
console.log(categoriesStore.count()); // the log here shows 0
});

Gary Schlosberg
5 Nov 2013, 5:10 PM
What does your data look like when you go to GridDataBase/categories.php in a browser?