user4296106
user4296106

Reputation:

Changing the colour of a table cell

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

Answers (2)

mlinth
mlinth

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

Ashish Panchal
Ashish Panchal

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

Related Questions