PDA

View Full Version : Move column grid programmatically



Sadd
22 Aug 2012, 9:58 AM
Hi, i'm working with a grid and one of the functionalities is move columns and numerate them for save on the server and columns with not draggable capabilitie has to be in the end of the grid. I have a grid and the following funtion:



function moveHidden() {
if (gridPO != null) {
for (var i = 1; i < gridPO.columns.length; i++) {
var column = gridPO.columns[i];
if (!column.draggable) {
column.move(i, gridPO.columns.length - 1);
}
}
}
gridPO.getView().refresh();
}


But this code is not working at all, anyone can help me with this?

Thanks,
Regards.
- Sadd

mankz
22 Aug 2012, 12:57 PM
Try iterating over grid.headerCt.getGridColumns(); instead..?

Sadd
22 Aug 2012, 1:15 PM
Thanks for your reply mankz but this don't solved my issue.

redraid
22 Aug 2012, 11:38 PM
Maybe this helps for you


Ext.create('Ext.data.Store', {
storeId:'simpsonsStore',
fields:['name', 'email', 'phone'],
data:{'items':[
{ 'name': 'Lisa', "email":"lisa@simpsons.com", "phone":"555-111-1224" },
{ 'name': 'Bart', "email":"bart@simpsons.com", "phone":"555-222-1234" },
{ 'name': 'Homer', "email":"home@simpsons.com", "phone":"555-222-1244" },
{ 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254" }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});

Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ text: 'Name', dataIndex: 'name' },
{ text: 'Email', dataIndex: 'email', flex: 1 },
{ text: 'Phone', dataIndex: 'phone' }
],
height: 200,
width: 400,
renderTo: Ext.getBody(),
tbar: [
{
text: 'move',
handler: function (btn) {
var grid = btn.up('grid'),
header = grid.headerCt;

header.move(0, 1); // move 1 col to 2 position (swap 1 and 2 cols)
grid.getView().refresh(); // refresh view (to rerender cells)
}
}
]
});
?


live: http://jsfiddle.net/gZkSS/1/

vietits
22 Aug 2012, 11:55 PM
Try this:


function moveHidden() {
if (gridPO != null) {
var headerCt = gridPO.headerCt;
var columns = headerCt.getGridColumns();
for (var i = j = colums.length - 1; i > -1; i--) {
if (!columns[i].draggable) {
headerCt.move(i, j--);
}
}
}
gridPO.getView().refresh();
}

Sadd
23 Aug 2012, 4:42 AM
Thanks for the help :)

- Sadd