extjs - Ext-all.js not responding when showing/hiding grid columns -
i ran issue in ext-all.js file hangs when attempting show/hide grid columns.
i'm using extjs 4.1.2 on mozilla firefox 25.0. os ubuntu 12.10, clarify.
when user edits row via plugin, hidden fields become shown user can edit them. after editing complete columns become hidden again.
controller.js:
var hiddencolumns = []; //global array storing columns init: function() { this.control({ ... 'mygrid': { beforeedit: function() { me.columnsvisibility('show'); }, afterrender: function(){ var me = this, formdatapanel = me.getformdatapanel(), activegrid = formdatapanel.getlayout().getactiveitem(); (i=0; < activegrid.columns.length; i++) { if (activegrid.columns[i].hidden) { ext.array.push(hiddencolumns, activegrid.columns[i]); } } }, edit: function(editor, e) { var me = this, usersstore = me.getstore('users'), alias = me.getuseralias(), record = usersstore.findrecord('email', alias, false, true, true), fdupdate = record.get('fdupdate'); me.columnsvisibility('hide'); if (fdupdate == 't') { try { e.store.sync(); } catch (e) { } e.record.commit(); } else { var store = me.getstore('inspection'); store.rejectchanges(); ext.msg.alert('alert!','this function not available you'); } }, ... } }); }, ... columnsvisibility: function(visible){ (var i=0; < hiddencolumns.length; i++) { if (visible == 'hide') { hiddencolumns[i].hide(); } else if (visible == 'show') { hiddencolumns[i].show(); } } }, ...
mygrid.js:
initcomponent: function() { var filters = { ftype: 'filters', // encode , local configuration options defined easier reuse encode: false, // json encode filter query local: true }, ext.apply(this, { title: 'inspection', id: 'inspection', // required since title can changed filter functions update status of grid. store: 'inspection', features: [filters], selmodel: ext.create('ext.selection.checkboxmodel', { checkonly: true }), plugins: [ ext.create('ext.grid.plugin.rowediting', { clickstoedit: 2 }) ], columns: [{ text: 'id', width: 35, dataindex: 'id' },{ text: 'record name', dataindex: 'record_name', width: 70,//flex: 1, hidden: true, editor: { querymode: 'local', displayfield: 'record_name', valuefield: 'record_name', editable: false }, filter: { type: 'string' } },{ text: 'date created', dataindex: 'date_created', width: 150, filter: { type: 'string' } }] }); this.callparent(arguments); } });
while code work intended, causes browser hang moderate amount of time before prompting me message informing script being busy/unresponsive (script: http://localhost/lib/ext-4.1.2/ext-all.js:18
)
i uncertain whether problem lies version of extjs, code or browser. if appreciated.
hide , show can expensive operations involve manipulating dom , subsequent browser reflows. couple of rows not create considerable delay number of rows grows can experience slowdowns.
i consider open separate ext window form containing fields editing, not showing , hiding columns of all rows of grid.
Comments
Post a Comment