Change header style on header lick

Can just the selected header cell’s background color be changed on a onHeaderClick event?

The underlying rows can remain as they are. I just want to change the header’s cell.

“onHeaderClick” event handler has paramethers:

* ind - index of the column;
* obj - related javascript event object.

You can use “ind” parameter to take a reference to the grid’s header cell and set necessary styles to it:

mygrid.hdr.rows[1].cells[ind].style.cssText=“background-color: red;”;

That works.  However, going one step further, how do you reset the css background if another column header is clicked?

Clicking on column 0 and then clicking on column 1 will result in both columns having the background color changed.  I’d like for column 0 to return to its original color.

You can use following code:

for (var i=0; i<cells.length; i++){

div.gridbox table.hdr td.unclicked {
background-color: #C4C4F7;
div.gridbox table.hdr td.clicked {
background-color: #6358B5;