Click here to Skip to main content
15,886,578 members

Response to: How to make this row in GridView in a Grey color when the Checkbox is unchecked?

Revision 5
another solution is using a javascript (jquery) in order to change the color.

a first "scan" of the checkbox
and then check the click event.

the click event can be removed if the checkbox is readonly.

HTML
<html>
 <head>
   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
   <style type="text/css">
  .highlight { background-color:gray; color:#eee;}
   </style>
  <script type="text/javascript">
    $(document).ready(function() {
     Paint();
     
     $("#tabledata :checkbox").click(function () {
      $(this).parent('td').parent('tr').toggleClass("highlight");
     });
    });
 
    function Paint() {
     $("#tabledata :checkbox:checked").each(function() {
      $(this).parent('td').parent('tr').toggleClass("highlight");
     })
    }
   </script>
 </head>
 <body>
  <table id="tabledata">
   <tbody>
    <tr><td>text1</td><td><input type="checkbox" ></td></tr>
    <tr><td>text1</td><td><input type="checkbox" checked="checked"></td></tr>
    <tr><td>text1</td><td><input type="checkbox" ></td></tr>
    <tr><td>text1</td><td><input type="checkbox" checked="checked"></td></tr>
   </tbody>
  </table>
 </body>
</html>


ps sorry for the strange view but the Preview is different from the result -.- i don't know how to change it :)
Posted 17-Jul-12 22:48pm by nrgjack.