urgent help needed

I have been trying to find another way to set background cell color other than using getCellTemplate() (This is too slow for high volume of calls) and the CSS (too many CSS entries would be created).

Where in the code is the background set?

I have tested getCellTemplate extensively for 5000 rows and have found that my scrolling time changes from 2 seconds to 6-7 seconds with the only change being the getCellTemplate calls. I can not demo this to my client at the speed but I need to have the functionality in!

Modifying the templates for the individual cells is a very heavy task - it creates a new template object each time and re-assembles html string for this cell.

The faster method would be to use one template with the background style attribute mapped to the additional cell (or row) property. This requires several steps:

- define (create) a new color property for the cell model

obj.defineCellProperty("color");

implement the new property in the datasource

table.getColor = function(col, row){
    return this.getData(2, row); // color is stored in col-2
}

modify the cell template to request color value

var cell = new AW.Templates.Text;
cell.setStyle("background", function(){
    return this.getCellProperty("color");
});

assign the new cell template to the grid column

obj.setCellTemplate(cell, 1);

Here is full code -

var table = new AW.CSV.Table;
    table.setURL("data.csv");

    // add color property to the CSV datasource
    table.getColor = function(col, row){
        return this.getData(2, row);
    }
    table.request();

    // add color request to the cell template
    var cell = new AW.Templates.Text;
    cell.setStyle("background", function(){
        return this.getCellProperty("color");
    });

    var obj = new AW.UI.Grid;

    // add color property to the cell model
    obj.defineCellProperty("color");

    // assign modified template to the col-1
    obj.setCellTemplate(cell, 1);

    obj.setColumnCount(2);
    obj.setCellModel(table);
    document.write(obj);

Alex,

Great! Thanks. The only thing that is still a little confusing is the
this.getData(2, row); method.

I am calculating the color of a column based upon comparing the values in two other columns. What would be in the csv file? #nnnnnn ?

Can I code it so it does not need to read from csv?

Thanks again.

I'm just thinking about this and correct me if I'm wrong - I could code the getcolor function to go against an array if i wanted to (the csv column might be better). I only want to take the time to set the color if it is different than the default.

The example assumes that the color is stored in the CSV file in a separate column (column 2) like "#FF0000". The getColor function simply calls getData() method for this row and column-2. -

CSV.TXT

cell1, cell2, #FF0000
cell3, cell4, #00FF00

You can implement the getColor method which calculates the color dynamically, just be careful to make it fast if your goal is to optimize loading/repaint speed. Most often the fastest would be doing it on the server :-)