How can I highlight a column on the sort event?

Any ideas how I could highlight a column contents when that column is sorted, similar to Windows Explorer in Windows XP? I search the forum but couldn't find anything.

Nobody?

bump

Based on:
http://activewidgets.com/javascript.forum.3810.8/wait-cursor-before-search-then.html

I include the code for color-sort
HTH
Carlos

<script>
var stylesheetX = document.styleSheets[document.styleSheets.length-1];

// create ActiveWidgets Grid javascript object
var obj = new Active.Controls.Grid;
obj.setId('Myobj');

// set number of rows/columns
obj.setRowProperty("count", 20);
obj.setColumnProperty("count", 5);

// provide cells and headers text
obj.setDataProperty("text", function(i, j){return myData[i][j]});
obj.setColumnProperty("text", function(i){return myColumns[i]});

// set headers width/height
obj.setRowHeaderWidth("28px");
obj.setColumnHeaderHeight("20px");

// set click action handler
obj.setAction("click", function(src){window.status = src.getItemProperty("text")});

/////////////////////////////////////////////////
function headerClickedfunc(e) {

var boton = e.srcElement.id;
var botoninit = boton.indexOf(":" ,9);
var botonend = boton.indexOf("/" ,9);
var numboton = boton.substring((botoninit+1),(botonend));

var lastcolord = obj.getSortProperty("index");
var lastcoldir = obj.getSortProperty("direction");

obj.setStatusProperty("code", "loading");
stylesheetX.addRule('#Myobj .active-column-' + numboton , 'background-color: gray!important' );
obj.refresh();

//start timeout
window.setTimeout(function(){
if (lastcolord == numboton) {
if(lastcoldir == "ascending") { obj.sort(numboton, "descending");}
else{obj.sort(numboton, "ascending");}
}

else{obj.sort(numboton, "ascending"); }

stylesheetX.addRule('#Myobj .active-column-' + lastcolord , 'background-color: white!important' );

obj.setStatusProperty("code", "");
obj.refresh();}, 0); //<< end timeout
}
//********************************
obj.getTemplate("top/item").setEvent("onmousedown", headerClickedfunc);
//////////////////////////////////////////////////////////


// write grid html to the page
document.write(obj);

</script>

Upppsss!
Sorry.. Rreplace the function with this one:

/////////////////////////////////////////////////
function headerClickedfunc(e) {

var boton = e.srcElement.id;
var botoninit = boton.indexOf(":" ,9);
var botonend = boton.indexOf("/" ,9);
var numboton = boton.substring((botoninit+1),(botonend));

var lastcolord = obj.getSortProperty("index");
var lastcoldir = obj.getSortProperty("direction");

obj.setStatusProperty("code", "loading");
stylesheetX.addRule('#Myobj .active-column-' + lastcolord , 'background-color: white!important' );
obj.refresh();

//start timeout
window.setTimeout(function(){
if (lastcolord == numboton) {
if(lastcoldir == "ascending") { obj.sort(numboton, "descending");}
else{obj.sort(numboton, "ascending");}
}

else{obj.sort(numboton, "ascending"); }

stylesheetX.addRule('#Myobj .active-column-' + numboton , 'background-color: gray!important' );

obj.setStatusProperty("code", "");
obj.refresh();}, 0); //<< end timeout
}
//********************************
obj.getTemplate("top/item").setEvent("onmousedown", headerClickedfunc);
//////////////////////////////////////////////////////////