SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard
    Join Date
    Jul 2006
    Location
    New Zealand
    Posts
    1,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript Select all Snippet

    Hi all,

    I am starting to work on a select all function for personal project for myself and this is my code
    Code HTML4Strict:
    <script type="text/javascript">
    function SetAllCheckBoxes(FormName, FieldName, CheckValue)
    {
    	if(!document.forms[FormName])
    		return;
    	var objCheckBoxes = document.forms[FormName].elements[FieldName];
    	if(!objCheckBoxes)
    		return;
    	var countCheckBoxes = objCheckBoxes.length;
    	if(!countCheckBoxes)
    		objCheckBoxes.checked = CheckValue;
    	else
    		// set the check value for all check boxes
    		for(var i = 0; i < countCheckBoxes; i++)
     
    			objCheckBoxes[i].checked = CheckValue;
     
    }
     
    </script>
    <body>
    <form method="post" name="myForm" onsubmit="return false;">
    <table>
    	<tr>
        	<th>Select All</th>
            <th><input type="checkbox" 
            onclick="SetAllCheckBoxes('myForm', 'myCheckbox', true);" ondblclick="SetAllCheckBoxes('myForm', 'myCheckbox', false);">
    </th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    	<tr>
        	<th>Name</th>
        	<th><input type="checkbox" name="myCheckbox"></th>
        </tr>
    </table>
    </form>

    Ive seen on msn hotmail they use sort of thing where if you tick or check the select all tick box it ticks all of them if you untick the select all tick box it unticks them all ive sort of got it the way i have it but only with double click how can i do it with single click what do i need to change so when i click on it once it switches from unchecked to check and vice versa?

    Can anyone help me here?

    Thanks,William

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,192
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    See how this goes for you

    Code JavaScript:
    function SetAllCheckBoxes(form, field) {
        var form = document.forms[form];
        if (typeof form === 'undefined') return;
     
        var objCheckBoxes = form.elements[field];
        if (typeof objCheckBoxes == 'undefined') return;
     
        var countCheckBoxes = objCheckBoxes.length;
     
        if (countCheckBoxes >= 1) {
            // Check or un-check the elements based on there current
            // checked="checked" status
            for(var i = 0; i < countCheckBoxes; i++) {
                objCheckBoxes[i].checked = (objCheckBoxes[i].checked) ? false : true;
            }
        }
    }

  3. #3
    SitePoint Wizard
    Join Date
    Jul 2006
    Location
    New Zealand
    Posts
    1,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Okay thanks


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
  •