Better way

I have a find function for a grid that changes the color of each cell in which the string is found. Hence, I have a reset function that changes the cell back to thier original color. The problem is that the reset function goes cell by cell, row by row to reset the colors, and so when I have 20 columns and 100 rows this function takes about 40 seconds. I tried:

function clearGrid(){
obj.clearCellModel();
obj.clearRowModel();
obj.clearScrollModel();
obj.clearSelectionModel();
obj.clearSortModel();
obj.refresh();
}
but when I reload the page the cells are still colored. I am using a licensed copy of version 2.0.

It takes so much time because modifying the template style for each cell involves creating template clone and recompile of template html for each cell separately.

Much more efficient would be implementing additional property in the cell data model and linking the cell color to this cell property.

You should add new cell property -

obj.defineCellProperty("color", false)

Link it to the cell background -

obj.getCellTemplate().setStyle("background", function(){
        return this.getCellProperty("color") ? "red" : "white";
    });

And than you can reset it this way -

obj.setCellColor(false);
        obj.refresh();

Complete example -

var obj = new AW.UI.Grid;
    obj.setCellText(function(i, j){return j + "." + i});
    obj.setHeaderText(function(i){return "Col " + i});
    obj.setColumnCount(20);
    obj.setRowCount(100);


    // create new cell property, default value = false
    obj.defineCellProperty("color", false)

    // link cell background to cell color property
    obj.getCellTemplate().setStyle("background", function(){
        return this.getCellProperty("color") ? "red" : "white";
    });

    // mark some cells
    for (var r=0; r<obj.getRowCount(); r++){
        for (var c=0; c<obj.getColumnCount(); c++){
            if (obj.getCellText(c, r).match("1")){
                obj.setCellColor(true, c, r);
            }
        }
    }

    document.write(obj);

    var button = new AW.UI.Button;
    button.setControlText("reset");
    document.write(button);

    button.onClick = function(){
        obj.setCellColor(false);
        obj.refresh();
    }

Wow, Yes this very quick. Thanks!!!