Remove current tablerow-SOLVED, new question - Zebra stripes

Remove current tablerow-SOLVED, new question - Zebra stripes

Follow up to previous question -

I would like to add automated zebra stripping, however when rows are added and deleted dynamically, the "tr:nth-child(odd)" solution does not work. I tried adding the zebra stripe function function to my "add row" function, but this was not any better. Copy code below to test...


Click an image - remove current table row

<style>
html{background-color:beige;}
tr{background: #6699CC;}
tr th{background: #FFCC66;}
.odd {background: #CCCC9A;}
</style>

<script type="text/javascript" src="scripts/jquery-1.2.6.js"></script>

<script language="javascript">
$(document).ready(function()
{

// for table identified by id=OrderLineTable,
// select all for <tr> after <tbody>
$("#OrderLineTable tbody tr:nth-child(odd)").addClass("odd");

   // use this syntax to use if table row is created dynamically
   // (ie: code generated after this function has been called initially)
   // $('a.imgCell').live("click", function() {

   // syntax to use if table row is static
   $('a.imgCell').click(function () {
      // get the ID associted with this table-row.
      var myID = $(this).parents('tr').attr("id");             
      $("#" + myID).fadeTo(2000, 0.5);
         $("#" + myID).remove();
      return false;
   });
   
});   
</script>
      
   <table id="OrderLineTable">
      <thead>
         <tr id="OrderLines">
            <th>Se.</th>            
            <th>Code</th>            
            <th>Del.</th>
            <th>Rédac.</th>
         </tr>
      </thead>
      <tbody>   
         <tr id="row5">
            <td>5</td>
            <td>GAT</td>      
            <td>  <a href="#" class="imgCell" ><img src="../img/delete.gif"/></a>  </td>
            <td>  <a href="#"><img src="../img/edit.gif"/></a>  </td>
         </tr>

         <tr id="row6">
            <td>6</td>
            <td>GAT</td>      
            <td>  <a href="#" class="imgCell" ><img src="../img/delete.gif"/></a>  </td>
            <td>  <a href="#"><img src="../img/edit.gif"/></a>  </td>
         </tr>
         
         <tr id="row7">
            <td>7</td>
            <td>GAT</td>      
            <td>  <a href="#" class="imgCell" ><img src="../img/delete.gif"/></a>  </td>
            <td>  <a   href="#"><img src="../img/edit.gif"/></a>  </td>
         </tr>
         
         <tr id="row8d">
            <td>8</td>      
            <td>GAT</td>      
            <td>  <a href="#" class="imgCell" ><img src="../img/delete.gif"/></a>  </td>
            <td>  <a href="#" ><img src="../img/edit.gif"/></a>  </td>
         </tr>         
      </tbody>
   </table>
   

    • Topic Participants

    • itps