PDA

View Full Version : grid cell text coloring suggestion



alebar
6 Aug 2010, 7:45 AM
Hi all,
I'm looking for a suggestion to avoid 'big' calculation for an apparently 'small' problem.
I've built a grid where users are able to perform operations on cells by using a KeyMap (i.e. cell shifting with left/right arrow and so on). It is also possible coloring text inside cells relying on given specifications.
By following suggestions (both FAQ and forum) I've implemented this solution:

for (i=0; i<numRows; i++){
var record = store.getAt(i);
for (j=3; j<numColumn; j++){
var fieldName1 = cm.getDataIndex(j);
var data1 = record.get(fieldName1);
var myCell=view.getCell(i,j);
switch(data1) {
case 'A':
Ext.fly(myCell).addClass(myClass);
break;
//several cases...

}
}
}


This code works perfectly, but everytime I perform a row refreshing the applied coloring scheme is lost, and I've to run again the entire routine slowing down user grid operation performances.
So, have you any tip to 'mantain' css class after a row refreshing is performed?
Thanks in advance....

Condor
6 Aug 2010, 10:11 AM
You should have beein using column renderers to assign the classes to the cells!

alebar
10 Aug 2010, 2:13 AM
Thx Condor, I realized I was wrong :)

Anyway, whether I've taken a look to API, I've not been able to figure out setRenderer() behaviour. Maybe it is a stupid thing, but it is making me crazy!

I wrote down a simple renderer:

applyColoringScheme: function(aa, metadata, colScheme, threshold, colSimVals, sim){

if (sim == true) {
if (aa!='-'){
console.log(colSimVals[aa], aa)
if (colSimVals[aa] >= threshold) {
metadata.css = colScheme+'-cons'+aa;
} else {
metadata.css = colScheme+'-notcons'+aa;
}
}
} else {
metadata.css = colScheme+'-notcons'+aa;
}
return aa;
}

Then I want this to be applied dinamically to my grid relying on given user actions:


cm.setRenderer(3, function(val, metadata, record, rowIndex, colIndex, store){
return Platform.coloring.applyColoringScheme(val, metadata, colScheme, threshold, colSimVals, true)
});

This seems to work and, after a grid refreshing, column 3 is rendered correctly.

Now, since I need to render every column in my grid, I thought that putting this code inside a for loop will have solved my problem; but it isn't so.
This is what I have (simply) done:


for (i=0; i<=numberOfColumns; i++){
cm.setRenderer(i, function(val, metadata, record, rowIndex, colIndex, store){
return Platform.coloring.applyColoringScheme(val, metadata, colScheme, threshold, colSimVals, true)
});
};

Can you help me (if it's possible) to understand what is going on?
Many many thanks!

Condor
10 Aug 2010, 3:36 AM
Why use setRenderer? Why not simply specify the 'renderer' in your column config object?