PDA

View Full Version : Move column within a grid programmatically



raz0r1
17 Aug 2011, 9:40 PM
Hi,
I want to move column in a grid after a specific listener is called.
If I directly drag+drop the column with the mouse everything works, but how can I do that by javascript?

I tried http://docs.sencha.com/ext-js/4-0/#/api/Ext.container.AbstractContainer-method-move but this does not work.
Further I added following listeners to the gridcolumn:

'gridcolumn': { columnmove: function(ct, column, fromIdx, toIdx) {
console.log(ct);
console.log(column);
console.log(fromIdx);
console.log(toIdx);
},
move: function(comp, x, y) {
console.log(comp);
console.log(x);
console.log(y);
}
}

the interesting thing is, that only move is fired when i move a column within a grid. "columnmove"-event is never fired (also not, when i drag+drop manually with the mouse)

what could be the issue?


Another solution would be, if I could redraw the grid panel after I changed the panel.columns array manually.



listPanel.columns = [];
for (var key in fieldsToShow) {
if(typeof(listPanel.showableColumns[fieldsToShow[key]]) != "undefined")
listPanel.columns.push(listPanel.showableColumns[fieldsToShow[key]]);
}
// here I have to redraw

Firebug says that the columns array is changed but this does not take any effect.

I tried nearly every method. Does anyone know how to do that?

thanks in advice.

Christopher

tobiu
18 Aug 2011, 2:03 AM
you can modify the gridDataColumns inside of the Ext.grid.header.Container and afterwards call



grid.getView().refresh();



best regards

stevil
18 Aug 2011, 6:32 AM
you can also try something like:




grid.headerCt.move(oldColumnIndex, newColumnIndex);



hope this helps,

stevil