Skip to main content

I am wanting to change the the background color of a table cell based on the text value within the cell. I.e. if the value in the cell is "Good" change the background color to green and so on.

 

I am converting an excel table to html table using the HTMLReportGenerator then created custom html where the script below runs but the output doesn't work. I just get the html table with no background colors.

 

The jQuery code below seems to work when testing it using this site - jQuery toggleClass example - JSFiddle - Code Playground :

 

<script>

 

var cell = $('td'); 

 

cell.each(function() { //loop through all td elements ie the cells

 

var cell_value = $(this).html(); //get the value

 

if (cell_value == "Bad") //if then for if value is "Bad"

  $(this).css({'background-color' : 'red'});  // changes td to red.

  else if (cell_value == "Good") //if then for if value is "Good"

  $(this).css({'background-color' : 'green'});  // changes td to green.

  else if (cell_value == "Ok") //if then for if value is "Ok"

  $(this).css({'background-color' : 'yellow'});  // changes td to yellow.

});

 

</script>

jsfiddle result:

jsfiddle_screenshot 

Here's the output HTML table:

output_htmltable 

HTMLReportGenerator setup:

htmlreportgenerator 

 

Any ideas? Let me know if more information is needed.

 

Any help is greatly appreciated.

Create your table using HTMLReportGenerator and use consecutive StringReplacer transformers to replace <td>YourTextHere</td> with <td bgcolor="some_color_name">YourTextHere</td>.

For example, replace <td>Goog</td> with <td bgcolor="green">Goog</td>, <td>Ok</td> with <td bgcolor="yellow">Ok</td> and <td>Bad</td> with <td bgcolor="red">Bad</td>

Alternatively you can create attributes for bgcolor and use a single StringReplacer to replace <td> with <td bgcolor="@Value(color_attribute_created_by_you)">. But that may not work as you lose the attributes after HTMLReportGenerator.


Create your table using HTMLReportGenerator and use consecutive StringReplacer transformers to replace <td>YourTextHere</td> with <td bgcolor="some_color_name">YourTextHere</td>.

For example, replace <td>Goog</td> with <td bgcolor="green">Goog</td>, <td>Ok</td> with <td bgcolor="yellow">Ok</td> and <td>Bad</td> with <td bgcolor="red">Bad</td>

Alternatively you can create attributes for bgcolor and use a single StringReplacer to replace <td> with <td bgcolor="@Value(color_attribute_created_by_you)">. But that may not work as you lose the attributes after HTMLReportGenerator.

The StringReplacer transformers work for my needs. Thanks so much!


Create your table using HTMLReportGenerator and use consecutive StringReplacer transformers to replace <td>YourTextHere</td> with <td bgcolor="some_color_name">YourTextHere</td>.

For example, replace <td>Goog</td> with <td bgcolor="green">Goog</td>, <td>Ok</td> with <td bgcolor="yellow">Ok</td> and <td>Bad</td> with <td bgcolor="red">Bad</td>

Alternatively you can create attributes for bgcolor and use a single StringReplacer to replace <td> with <td bgcolor="@Value(color_attribute_created_by_you)">. But that may not work as you lose the attributes after HTMLReportGenerator.

But if it is a date field, and you want to give a different bgcolor to historical dates?


But if it is a date field, and you want to give a different bgcolor to historical dates?

If I've wanted to do more complex conditional queries I've always ended up resorting to python.


Reply