[Javascript] Check boxs and table row back ground colors

[Abyss - Information]

Dear Peter,

Thank heaps, yeah i thought about the function after i wrote the letter because (as you mentioned) the onselect doesn't work......

I appreciate the code alot and for the quick response...


i hate googling :( it is bringing back nothing but junk lately, i just thought you might have a specific link that you like as a reference....thanks heaps again

Abyss
www.abyss.ws
  ----- Original Message ----- 
  From: Peter Brunone 
  To: javascript at LaTech.edu 
  Sent: Tuesday, April 25, 2006 4:21 PM
  Subject: re: [Javascript] Check boxs and table row back ground colors


  Um... I won't throw anything into your ducts.  Just don't bring it up again.

     When you assign style attributes with Javascript, you replace the hyphenated syntax with camel casing (which is probably a misnomer on my part, so I apologize).  Therefore, 

  this.style.background-color='#123456';

  would become

  this.style.backgroundColor='#123456';

     Now there's the little matter of the event handler you're trying to use :)  Checkboxes don't have an "onselect" event... so you'll have to settle for onclick (with a possible onkeydown to handle users who tab to the checkbox and hit spacebar).

  onclick="this.style.backgroundColor='#123456';"

     Of course this still doesn't take into account whether the box is being checked or not, so we should probably encapsulate this whole crazy thing into a function and call that.  Also, since you want to change the background of the *row* and not the checkbox, we should probably assign the color to that, eh?

  <script language="javascript" type="text/javascript">
  onclick="checkColor(this)"

  function checkColor(chkRow) {
     var theRow = chkRow.parentNode.parentNode;

     if(chkRow.checked) {
        theRow.style.backgroundColor = "#123456";
        }
     else {
        theRow.style.backgroundColor = "#654321";
        }
     }
  </script>

     This is completely untested (just whipped out off the top of my head), but it should get you really close.  As for references, the W3C should have refs for everything that you mentioned below.  Have you tried a bit of googling, perhaps using the -site parameter?

  Cheers,

  Peter

  From : "Abyss - Information" Info at Abyss.ws 


  Hey all, 

  I have a question for all the scripted gifted. 


  I have a table (with table rows....yes amazing...) 

  anyway in this table i have check boxs(which people will tick for what they desire), what I wish to do is when a particular box is ticked for that entire "tr" to be colored a different color from the rest 
  like a highlight the row sort of thing. 

  the page is XHTML 1.1 strict compliant (which every page should be - *ducts from the objects that non compliant people throw*) 

  how would i achieve this? 

  I have been fiddling around with this 

  <tr>
      <td> 
          <input id="chkbxID<%=rs("ID")%>" name="chkbxID" type="checkbox" value="<%=rs("ID")%>" onselect="this.style.background-color='#123456';" /> 
      </td>
      <td><%=rs("Title")%></td> 
  </tr>  

  but with no-luck- any ideas? 


  Also just off this topic on a side note 
  for CSS2 there is a property index (http://www.w3.org/TR/REC-CSS2/propidx.html) is is a fantastic reference page for all the CSS styles 

  is there any sort of reference like this on the DOM or javascript? if so can you link me please..thanks heaps 

  Thanks heaps 

  Abyss 


------------------------------------------------------------------------------


  _______________________________________________
  Javascript mailing list
  Javascript at LaTech.edu
  https://lists.LaTech.edu/mailman/listinfo/javascript
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20060425/ac225677/attachment.htm>