javascript - EXT Multiple Paging Toolbars Only 1 Works -
my basic problem this, have page 3 grids, of have paging toolbars. grid render on page load. when page loads, 1 of 3 toolbars works. other 2 don't show page numbers, , buttons greyed out. i've tried can think of, if populate on page load, 1 works. if render separately, button click on page, toolbars work perfectly.
has else had issue , solved it?
multiple grid , multiple paging toolbar in single window on page load in extjs
ext.onready(function () { var userstore = ext.create('ext.data.store', { autoload: 'false', fields: [ { name: 'name' }, { name: 'email' }, { name: 'phone' } ], data: [ { name: 'lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' }, { name: 'bart', email: 'bart@simpsons.com', phone: '555-222-1234' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, ] }); var userstore1 = ext.create('ext.data.store', { autoload: 'false', fields: [ { name: 'name' }, { name: 'email' }, { name: 'phone' } ], data: [ { name: 'lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' }, { name: 'bart', email: 'bart@simpsons.com', phone: '555-222-1234' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, ] }); var userstore2 = ext.create('ext.data.store', { autoload: 'false', fields: [ { name: 'name' }, { name: 'email' }, { name: 'phone' } ], data: [ { name: 'lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' }, { name: 'bart', email: 'bart@simpsons.com', phone: '555-222-1234' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, { name: 'homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, { name: 'marge', email: 'marge@simpsons.com', phone: '555-222-1254' }, ] }); ext.create('ext.window.window', { height: 600, width: 400, xtype: 'panel', layout: 'fit', title:'multiple grid , multiple toolbar in single window on page load', items: [ { layout: 'border', height: 350, renderto: ext.getbody(), items: [ { xtype: 'panel', region: 'north', layout: 'fit', items: [ { xtype: 'grid', store: userstore1, columns: [ { header: 'name', width: 100, sortable: false, hideable: false, dataindex: 'name' }, { header: 'email address', width: 150, dataindex: 'email', }, { header: 'phone number', flex: 1, dataindex: 'phone' } ] }, ], dockeditems: [ { xtype: 'pagingtoolbar', itemid: 'paginglog', store: userstore1, dock: 'bottom', displayinfo: true, }, ] }, { xtype: 'panel', region: 'center', items: [ { xtype: 'grid', store: userstore2, columns: [ { header: 'name', width: 100, sortable: false, hideable: false, dataindex: 'name' }, { header: 'email address', width: 150, dataindex: 'email', }, { header: 'phone number', flex: 1, dataindex: 'phone' } ] }, ], dockeditems: [ { xtype: 'pagingtoolbar', itemid: 'paginglog', store: userstore2, dock: 'bottom', displayinfo: true, }] }, { xtype: 'panel', region: 'south', items: [ { xtype: 'grid', id: 'gridid', store: userstore, columns: [ { header: 'name', width: 100, sortable: false, hideable: false, dataindex: 'name' }, { header: 'email address', width: 150, dataindex: 'email', }, { header: 'phone number', flex: 1, dataindex: 'phone' } ] }], dockeditems: [ { xtype: 'pagingtoolbar', itemid: 'paginglog', store: userstore, dock: 'bottom', displayinfo: true, }] }] }] }).show(); });
Comments
Post a Comment