Reputation:
I am using ASP.net to display data in a html table.
<td>
<div align="left" >
<%= %TRIM(DLDPFS + ' ' + Status) %>
</div>
</td>
What I wanted was for if the value in status was to equal particular things, the box it is in should change color. But I am not sure if this is possible, as you cant really do much in the way of conditions with CSS.
So if status = 'low' make the cell red, high make the cell green etc.
Anyone got any ideas on how I can achieve this?
Upvotes: 1
Views: 151
Reputation: 3118
Just put your status value into a class attribute, then add appropriate CSS. E.g.
<td class = "<%= %TRIM(DLDPFS + ' ' + Status) %>">
<div align="left" >
<%= %TRIM(DLDPFS + ' ' + Status) %>
</div>
</td>
Css e.g.
.low {
background-color: red;
}
Upvotes: 2
Reputation: 504
You can achieve this with JS & CSS.
JS:
var val = document.getElementsByTagName("td"),
len = val.length;
for(var i = 0; i < len; i++){
var temp = val[i].innerText;
if(temp > 0){
val[i].innerHTML = '<span class="high">'+ temp +'</span>'
} else {
val[i].innerHTML = '<span class="low">'+ temp +'</span>'
}
}
CSS:
.high { color:green; }
.low { color:red; }
Hope this helps!
Upvotes: 3