ExtJS4: Columns hiding. Too slow

Question

In different data types I need to hide some columns (not one) from grid. I'm using column.hide() method, but it works too slow.

If I set hidden property to the column, I don't know method, that will refresh grid view.

If I do grid.view.refresh() - header is still there.

How can I refresh grid after setting hidden:true properties?

Or some other way...

Standart creating. Like in Sencha docs. I want to hide columns not while creating grid. When grid is created, I can click some buttons (there are some data conditions), and grid will load itself from server with that condition. And then I want to hide some columns. I want to hide some columns from button handler code. — nkuhta, Apr 02 '12 at 11:31
Possibly try the answer suggested on this question? http://stackoverflow.com/questions/5680080/how-to-dynamically-show-hide-columns-in-extjs-grid — Amalea, Apr 02 '12 at 13:13

score 2 · Accepted Answer · edited Jul 23 '12 at 16:24

2

I had the same problem. I need to establish visibility and the size for columns. If I use standard methods, then it takes 24 seconds (~120 columns).

My solution:

var grid = ...;
for (var i = 0; i < grid.columns.length; i++) {
    var column = grid.columns[i];
    column.hidden = false // or true, instead column.setVisible(bool);
    column.width = 100 // instead column.setWidth(100);
}
grid.headerCt.updateLayout();

Now it takes 114 ms instead 24 seconds.

edited Jul 23 '12 at 16:24

carmenism

1,087
3
12
31

answered Jul 23 '12 at 12:21

atott

880
10
15

Be careful, this solution can lead to artifacts when resizing columns with the mouse. Another way (little bit slowly ~1sec) Ext.suspendLayouts(); for (var i ....) {...} Ext.resumeLayouts(true); – atott Jul 24 '12 at 07:01

ExtJS4: Columns hiding. Too slow

1 Answers1