Here is the JS fiddle where I just copy pasted the sample example given by ExtJS and Kept only 1 column and that too locked. In this scenario we have 2 errors :
Is it bug from ExtJS 4.2.1 Infinite Grid ? is there a solution ? If we add 1 more column unlocked then its working fine (It will make only 1 request to backend and on scroll it will make next request depending on the scroller position)
Below is the same code :
Ext.onReady(function () { Ext.define('ForumThread', { extend: 'Ext.data.Model', fields: [ 'title', 'forumtitle', 'forumid', 'username', { name: 'replycount', type: 'int' }, { name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp' }, 'lastposter', ' ', 'threadid'] }); // create the Data Store var store = Ext.create('Ext.data.Store', { id: 'store', model: 'ForumThread', //remoteGroup: true, // allow the grid to interact with the paging scroller by buffering buffered: true, leadingBufferZone: 300, pageSize: 50, proxy: { // load using script tags for cross domain, if the data in on the same domain as // this page, an Ajax proxy would be better type: 'jsonp', url: 'http://ift.tt/1ijVORH', reader: { root: 'topics', totalProperty: 'totalCount' } }, autoLoad: true, listeners: { // This particular service cannot sort on more than one field, so if grouped, disable sorting beforeprefetch: function (store, operation) {} } }); var grid = Ext.create('Ext.grid.Panel', { width: 700, height: 500, collapsible: true, title: 'ExtJS.com - Browse Forums', store: store, loadMask: true, // grid columns columns: [{ id: 'last', text: "Last Post", locked: true, dataIndex: 'lastpost', width: 130, renderer: Ext.util.Format.dateRenderer('n/j/Y g:i A'), sortable: true, groupable: false }], renderTo: Ext.getBody() });});
- Its making continuous calls to backend till it gets last result. We can check in fiddler that the calls are getting posted to backend continously till the last page.
- I am not able to scroll(vertical) in grid
Is it bug from ExtJS 4.2.1 Infinite Grid ? is there a solution ? If we add 1 more column unlocked then its working fine (It will make only 1 request to backend and on scroll it will make next request depending on the scroller position)
Below is the same code :
Ext.onReady(function () { Ext.define('ForumThread', { extend: 'Ext.data.Model', fields: [ 'title', 'forumtitle', 'forumid', 'username', { name: 'replycount', type: 'int' }, { name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp' }, 'lastposter', ' ', 'threadid'] }); // create the Data Store var store = Ext.create('Ext.data.Store', { id: 'store', model: 'ForumThread', //remoteGroup: true, // allow the grid to interact with the paging scroller by buffering buffered: true, leadingBufferZone: 300, pageSize: 50, proxy: { // load using script tags for cross domain, if the data in on the same domain as // this page, an Ajax proxy would be better type: 'jsonp', url: 'http://ift.tt/1ijVORH', reader: { root: 'topics', totalProperty: 'totalCount' } }, autoLoad: true, listeners: { // This particular service cannot sort on more than one field, so if grouped, disable sorting beforeprefetch: function (store, operation) {} } }); var grid = Ext.create('Ext.grid.Panel', { width: 700, height: 500, collapsible: true, title: 'ExtJS.com - Browse Forums', store: store, loadMask: true, // grid columns columns: [{ id: 'last', text: "Last Post", locked: true, dataIndex: 'lastpost', width: 130, renderer: Ext.util.Format.dateRenderer('n/j/Y g:i A'), sortable: true, groupable: false }], renderTo: Ext.getBody() });});
Aucun commentaire:
Enregistrer un commentaire