SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2007
    Posts
    50
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    change the color of the text for a check box

    <script type="text/javascript">
    <!--

    function checkAll(checkname, exby) {
    for (i = 0; i < checkname.length; i++)
    checkname[i].checked = exby.checked? true:false
    }
    // -->
    </script>

    Check/Uncheck All : <input type="checkbox" name="listmaster" id="listmaster" value="1" onclick="checkBoxes(this,"myform","mylist")" /><br />

    <input type="checkbox" name="mylist1[]" checked value="1" />Text1<br />
    <input type="checkbox" name="mylist1[]" checked value="2" />Text2<br />
    <input type="checkbox" name="mylist2[]" checked value="3" />Text3<br />
    <input type="checkbox" name="mylist3[]" checked value="4" />Text4<br />


    How can i change the color of the text when the checkbox unchecked?

  2. #2
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Columbus, OH
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The below code will solve this. I also added <LABEL> tags for the checkboxes (this is good from a usability standpoint.) Another hint: don’t forget to use checked=”checked” to have your page valid to W3C .. Good luck!

    <script type="text/javascript">
    <!--

    function checkAll(checkname, exby) {
    for (i = 0; i < checkname.length; i++)
    checkname[i].checked = exby.checked? true:false
    }

    function checkControlState(sender) {
    if(!sender){ return; }
    var lblObj = document.getElementById(sender.id + "l");
    if(!lblObj){ return; }
    lblObj.style.color = !sender.checked ? 'red' : '';
    }
    // -->
    </script>

    Check/Uncheck All : <input type="checkbox" name="listmaster" id="listmaster" value="1" onclick="checkBoxes(this,"myform","mylist")" /><br />

    <input type="checkbox" name="mylist1[]" checked value="1" id="ch1" onclick="checkControlState(this)" /><label for="ch1" id="ch1l">Text1</label><br />
    <input type="checkbox" name="mylist1[]" checked value="2" id="ch2" onclick="checkControlState(this)" /><label for="ch2" id="ch2l">Text2</label><br />
    <input type="checkbox" name="mylist2[]" checked value="3" id="ch3" onclick="checkControlState(this)" /><label for="ch3" id="ch3l">Text3</label><br />
    <input type="checkbox" name="mylist3[]" checked value="4" id="ch4" onclick="checkControlState(this)" /><label for="ch4" id="ch4l">Text4</label><br />
    Darren Stevenson - Programmer
    www.htmlBlender.com
    Hand coding services for XHTML, CSS, AJAX, and more!

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2007
    Posts
    50
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thnaks for your reply.But my checkboxes and text are in foreach loop(php); something like this

    foreach($array as $name => $value)
    {
    <label>
    <input type="checkbox" name="online[]" checked="checked" value="' .$value[0].'">'.$value[1].' </label>
    }

    how could i assign id for the each element of $value (i.e.text)?

  4. #4
    SitePoint Member
    Join Date
    Dec 2007
    Location
    Columbus, OH
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You could do something like:

    $i = 0;
    foreach($array as $name => $value)
    {
    echo '<label id=”ch’.$i.’l”>
    <input type="checkbox" name="online[]" checked="checked" id=”ch’.$i.’” value="'
    .$value[0].'">'.$value[1].' </label>';
    }
    Darren Stevenson - Programmer
    www.htmlBlender.com
    Hand coding services for XHTML, CSS, AJAX, and more!


Bookmarks

Posting Permissions

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