Changing the color of a cell based on the data showon within the cell using Jquery RSS

• • Reply
  Keeffe2387

  Member

  16 Points

  35 Posts

  Changing the color of a cell based on the data showon within the cell using Jquery

  Feb 11, 2011 06:42 AM|Keeffe2387|LINK

  @{ var db= Database.Open("MyDB");var sql = "SELECT * FROM MyTable "; var data = db.Query(sql); }

  
   

  This is the code that creates the SQL connection and selects all Change MyDB and MyTable to correspond with your DB and table.

   

  The JQuery

   

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script><script type='text/javascript'>
      $(function () { 
  
  $("#grid td").filter(function () {
  
  return $(this).text() == "Red";
  
  }).addClass("grdCellR"); 
  
  $("#grid td").filter(function () {
  
  return $(this).text() == "Green";
  
  }).addClass("grdCellG");
  
  $("#grid td").filter(function () {
  
  return $(this).text() == "Amber";
  
  }).addClass("grdCellA");});
  
  </script>
  
  

  
   

  This is the Script that looks through all the the <td> Table Data in "Myhtmltable" and checks to see if they contain the words Red, Green, or Amber, If they do they then apply the CSS MyhtmltableA, MyhtmltableG, MyhtmltableR depending on what it finds.

   

  The HTML

   

  <div>
  <table>
  @foreach(var row in data){ 
  <tr>   <td><a>row0</a></td><td>@row.EXAMPLE1</td> </tr>
  <tr>   <td ><a>row1</a></td><td>@row.EXAMPLE2</td> </tr>                
  <tr>   <td><a>row2</a></td><td>@row.EXAMPLE3</td> </tr>
  <tr>   <td><a>row3</a></td><td>@row.EXAMPLE4</td>  </tr>
  }</table></div>
  
  

  
   

  This is a basic HTML table that pulls the data contained within each table data cell from a database table called my table

  If anyone can spot anything i could do better, easier, or any bad practices i would appreciate your advice

  This is no all my own code and i would like to thank

  Mike @ http://www.mikesdotnetting.com

  And all at http://stackoverflow.com
  And http://www.eggheadcafe.com

   

  webmatrix