CHANGE COLOR OF ROW BASED ON VALUE OF A COLUMN IN THE ROW

john rob

Total Post:108

Points:756
Posted by  john rob
 732  View(s)
Ratings:
Rate this:

I have an sqldatasource that loads, data from my server and puts it in a datagrid.

What I want is that each row have a different color depending on which number is in that datarow column

$(document).ready(function () {

    $("#<%=GridView1.UniqueID%> tr").each(function () {

        var number = $(this).children('td:eq(6)').text();

        if (number == 'OK') {

            $(this).children('td').css({ "background-color": "lightgreen" });

        }

    })

});

  1. Sumit Kesarwani

    Post:378

    Points:2694
    Re: Change color of row based on value of a column in the row

    Hi John, 

    Granted you've given your gridview a css class called 'myGridView' you could do the following:

    $(document).ready(function () {

        $('.myGridView tr').each(function () {

            var number = $(this).children('td:eq(1)').text();

            if (number == '1') {

                $(this).children('td').css('background', 'red');

            }

        })

    });

    where 'td:eq(1)' refers to the second cell in a row. This of course will depend on what cell in your row contains this magic number.

    I'm certain it's not the most elegant use of jQuery, but you could refactor it as you wish.

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!