Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    May 2004
    Posts
    391
    Thanks
    76
    Thanked 0 Times in 0 Posts

    change row color

    Hi there. The following functions changes the row color. When the checkbox is clicked. How can I get rid of the color when the checkbox is unclicked??
    <script>
    function highlightRow (element, color) {
    while (element.tagName.toUpperCase() != 'TR' && element != null)
    element = document.all ? element.parentElement : element.parentNode;
    if (element)
    element.bgColor = color;
    }
    </script>
    <table>
    <tr>
    <td width=100% id=\"tdID1\" ><input type='checkbox' ONCLICK=\"highlightRow(this, 'blue');\" class='normal2' name='request[]' value='$line[id]' ></td>

    </tr></table>

  • #2
    gph
    gph is offline
    Regular Coder
    Join Date
    Apr 2005
    Posts
    161
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    function highlightRow (el, color) {
    color=el.checked?color:'';
    while (el.tagName.toUpperCase() != 'TR' && el != null)
    el = el.parentNode;
    if (el)
    el.style.backgroundColor = color;
    }

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    onclick="this.parentNode.parentNode.style.backgroundColor=(this.checked)?'blue':''"

    or, if you want a separate function

    function highlightRow (el, color){
    var oRow = el.parentNode.parentNode;
    el.style.backgroundColor=(el.checked)?color:'';
    }
    Last edited by Kor; 10-21-2005 at 09:45 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #4
    Regular Coder
    Join Date
    May 2004
    Posts
    391
    Thanks
    76
    Thanked 0 Times in 0 Posts
    The following functions works good to change the row color when the checkbox is clicked. How can I also change the checkbox border color within the same function??

    <script>
    function highlightRow (el, color) {
    color=el.checked?color:'';
    while (el.tagName.toUpperCase() != 'TR' && el != null)
    el = el.parentNode;
    if (el)
    el.style.backgroundColor = color;
    }
    </script>
    <input type='checkbox' ONCLICK="highlightRow(this, '#FF6F6F');" class='delete' name='delete[]' value='$line[id]' >

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    try (not tested)

    function highlightRow (el,col,bg){
    var oRow = el.parentNode.parentNode;
    oRow.style.backgroundColor=(el.checked)?color:'';
    el.style.border=(el.checked)?'1px solid '+bg:'none';
    }

    ...

    onclick="highlightRow(this,'#FF6F6F','#FF0000')"
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •