Disappearing row

Hi:

I'm currently designing a simple grid that has 8 rows and 12 columns. The grid is selectable by row. The color of the selection is chosen through a drop down box. I have also added a clear button that clears all of the selections. The problem is the following:
1. I choose a color for selection
2. I then select several rows
3. I then hit the clear button
4. All row backgrounds are reset back to the original color(nonselected color) which is white.
Only the problem is the row last selected, is missing all of its data.
The data will reappear though if you click any place in the grid.

Here are the code snippets:
My grid type:
var table = new AW.CSV.Table;

// provide data URL - plain text comma-separated file
table.setURL("data/dummydata.csv");

// start asyncronous data retrieval
table.request();

// create ActiveWidgets Grid javascript object
var obj = new AW.UI.Grid;
For changing the color of the selection; (note the selection color flashes blue first than changes to the selected color (I would like to fix this also, but I'm kind of new to css).

var myColors = new Array("fuchsia", "aqua", "lime");
var selectColor = "fuchsia";
function setSelectColor()
{ var i = document.forms[0].ExperimentColor.selectedIndex;
selectColor = myColors[i];
}

obj.onRowClicked = function(event, rowIndex){
this.getTemplate("row", rowIndex).setStyle("background-color", selectColor);
}

For reseting back to the background color:
function resetGridSelect()
{
for (i = 0; i < 9; i++)
{
obj.getRowTemplate(i).setStyle ("background", "white");
}

}