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 2 of 2
  1. #1
    New Coder
    Join Date
    Jun 2012
    Posts
    39
    Thanks
    11
    Thanked 0 Times in 0 Posts

    Select Checkbox on Page Load

    Hello,

    I need to automatically check a checkbox on page load. The thing is that the checkbox I want to check is a checkall box which checks others within the same form. Here is the code...


    <script type="text/javascript">
    /* This script and many more are available free online at
    The JavaScript Source!! http://www.javascriptsource.com
    Created by: Hillel Aftel | */
    function checkAll(checkname, exby) {
    for (i = 0; i < checkname.length; i++)
    checkname[i].checked = exby.checked? true:false
    }
    </script>

    <form name ="vspecs">
    <input type="checkbox" name="specall" onClick="checkAll(document.vspecs.equip,this)"> Select All
    <input type="checkbox" name="equip" value="aride"> Air-Ride

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Silly code.

    This:
    Code:
        checkname[i].checked = exby.checked? true:false
    should be shortened to just
    Code:
        checkname[i].checked = exby.checked;
    Also very poor code. Doesn't use { ... } around the for loop statements. Doesn't put a semicolon at the end of each statement. Doesn't declare the variable i. Would make me want to avoid code from that site.

    *********

    Anyway, two answers:

    (1) Put that code at the *END* of your HTML, not in the <head> section.
    And then just add
    Code:
    checkAll(document.vspecs.equip,document.vspecs.specall);
    to the end of it.

    That is:
    Code:
    <html>
    <body>
    <form name="vspecs">
    <input type="checkbox" name="specall" checked 
           onclick="checkAll(document.vspecs.equip,this)"> Select All
    <input type="checkbox" name="equip" value="aride"> Air-Ride
    ...
    </form>
    <script type="text/javascript">
    /* This script and many more are available free online at
    The JavaScript Source!! http://www.javascriptsource.com
    Created by: Hillel Aftel | */
    function checkAll(checkname, exby) {
        for (i = 0; i < checkname.length; i++)
        {
            checkname[i].checked = exby.checked;
        }
    }
    checkAll(document.vspecs.equip,document.vspecs.specall);
    </script>
    </body>
    </html>
    (2) The better answer:
    To begin with, named forms are obsolete. Use an ID for your form instead.

    And then write the code using UNOBTRUSIVE JavaScript:
    Code:
    <!DOCTYPE html>
    <html>
    <body>
    <form id="vspecs">
    <label><input type="checkbox" name="specall"/> Select All </label>
    <label><input type="checkbox" name="equip" value="aride"/> Air-Ride</label>
    ...
    </form>
    <script type="text/javascript">
    (
      function()
      {
          var form = document.getElementById("vspecs");
          form.specall.onclick = checkall;
    
          function checkall() 
          {
              for (var i = 0; i < form.equip.length; i++)
              {
                  form.equip[i].checked = form.specall.checked;
              }
          }
          // and checkall to get started:
          form.specall.checked = true;
          checkall();
      }
    )(); 
    </script>
    </body>
    </html>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    Rcoleman25 (01-21-2013)


  •  

    Posting Permissions

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