1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
|
Ext.onReady(function(){
// create the data store
var store = new Ext.data.JsonStore({
totalProperty: 'total', // total data, see json output
root: 'results', // see json output
url: 'data.php',
fields: [
{name: 'id', type: 'int'},
'user_name', 'body', 'rating'
]
});
// load data from the url ( data.php ) and add start and limit parameter
store.load({params:{start: 0, limit: 10}});
// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'id',header: "ID", width: 30, sortable: true, dataIndex: 'id'},
{header: 'Name', width: 100, sortable: true, dataIndex: 'user_name'},
{header: 'body', width: 300, sortable: true, dataIndex: 'body'},
{header: 'rating', width: 250, sortable: true, dataIndex: 'rating'}
//--------------------
],
stripeRows: true,
height:350,
width:700,
title:'Paging Grid',
bbar: new Ext.PagingToolbar({
pageSize: 10, // data to display
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
})
});
// render this grid to paging-grid element
grid.render('paging-grid');
}); |
Partager