Creating a grid that uses server-side sorting
The grid control has the ability to instruct its data store to sort the records cache, either in place, or by requesting the store's proxy to download a refreshed version of the data object in a sorted order.
In this recipe, the Movies grid implements server-side sorting. By default, the Title column is sorted:
Clicking on any column will initiate a sort operation on the server:
After the download, the sorted data is shown:
How to do it...
1. Define the data store:
var store = new Ext.data.JsonStore({ url: 'grid-sort-remote.php', root: 'movies', idProperty: 'id', fields: ['id', 'title', 'release_year', 'rating'], remoteSort: true });
2. Define the default sort:
store.setDefaultSort('release_year', 'desc');
3. Create the grid panel:
Ext.onReady(function() { var grid = new Ext.grid.GridPanel({ title: 'Movies', store: store, columns: [ { header: "ID", width: 30, dataIndex: 'id', sortable: true, hidden:true }, { id: 'title-col', header: "Title", width...