How to change grid column headers dynamically

Suite and Optimus Suite 5
#1

Hi Folks,

I have a 2 cell layout with grids in both cells. Based on a selection from the first grid I have to set the second grid’s column headers. In addition the number of columns may vary,so I may need to add or delete columns from the second grid.

I have not been able to find a simple way to do this. I have tried just re-running the grid.setHeader function and that didn’t work, then I tried the grid.attachHeader function, but that placed the new headers on a new row, and I need to add them to the original headers.

Any help would be much appreciated.

Thanks,

Daryl

#2

Attach the onRowSelect event handler:

grid.attachEvent("onRowSelect", function(id,ind){
   //change grid 2
});

Then inside the handler, you can change grid2 a couple of different ways…

Way 1: set the column label with:

grid.setColumnLabel(c_index,value,r_index);

Way 2: destroy the grid and then reattach and completely rebuild / load data

grid.destructor()
grid = cell.attachGrid();
/// rebuild from scratch

Way 3: hide and show the columns
dhtmlx.com/docs/products/dht … olumn.html

#3

Hi bmcgin, Thanks for your reply. The destroy option was the best for this case since the number of header fields does vary. I appreciate the help.

Regards,

Daryl

#4

Sounds good. I use the destroy approach in lots of places. In other cases I am able to load the grid with all columns/rows/data and then hide/show/filter the data.