...

View Full Version : Check All/Uncheck All checkboxes



hinch
08-14-2008, 11:24 AM
OK so it sounds fairly simple I have a form with many checkboxes in it all with the same name/id they're populated by php so ignore the \ :)

<input type=\"checkbox\" value=\"".$leads[0]."\" name=\"assignlead\" onclick=\"refreshMassUpdate(this)\">

Now at current when a checkbox is clicked it updates a hidden field with the value of the checkbox as I pass the created hidden field to the process page for stuff to happen with it. (its a list of id's basically)

I've noticed recently the list is getting kinda long 800+ items so rather than clicking each one individually 800 clicks upwards I want to put check all uncheck all buttons

Quick search around google turned up some simple code to do it


function checkAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = true ;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}

which works great BUT because each checkbox is no longer being clicked its not calling the refreshMassUpdate(this) script and so not populating my hidden field.

What I've been trying to work out is how to make the onclick of the button also clal the refreshMassUpdate(this) script so it also populates my hidden field. So far I'm an epic failure though javascript really isn't my thing. Are there's any easy ways of doing this or am I missing an obvious?

rangana
08-14-2008, 11:35 AM
Use this script:


function checkAll(e){
for(var i=0,check=document.getElementsByTagName('input');i<check.length;i++){
if(check[i].type=='checkbox'){
check[i].checked=e.checked;refreshMassUpddate(check[i]);}}}


And call the function on the "check all" checkbox:


<label for="lab">Check all </lab><input type="checkbox" onclick="checkAll(this)" id="lab">


Hope it helps.

hinch
08-14-2008, 11:43 AM
doesn't work or at least certainly not they way i envisage it working.

Hard to describe but it allows you to check each box individually but at this point doesn't update the hidden field like it should :( however if you click a checked box a 2nd time then it starts to randomly check unchecked boxes and clicking a 3rd time unchecks everything.

All the time not updating the hidden field. Thats why I was after a check all/uncheck all button.

There's actually an example of what I'm after on these here very forums :) If you've got a few private messages in your inbox if you look there's a series of check boxes which can be checked individually or what not and also a check all and uncheck all button at the bottom of the list. I've looked over the vb stuff though and I have to say it confuses the hell out of me i may have well been reading russian or something.

rangana
08-14-2008, 11:50 AM
Could you please show us your markup (HTML).

hinch
08-14-2008, 12:15 PM
The current refresh mass update function is like this


function refreshMassUpdate(checkBox) {
var massList = document.getElementById("List2Update");
var isChecked = checkBox.checked;
if ( massList ) {
var allChecked = massList.value.split(",");
if ( allChecked ) {
var newValue = "";
var isFound = false;
for ( var i = 0; i < allChecked.length; i++ ) {
if ( allChecked[i] == checkBox.value ) {
isFound = true;
if ( !isChecked ) {
continue; // remove it
}
}
newValue += (i > 0 && newValue != "") ? "," : "";
newValue += allChecked[i];
} // endfor i
if ( isChecked && !isFound ) {
newValue += ((newValue != "") ? "," : "") + checkBox.value;
}
massList.value = newValue;
} else if ( isChecked ) {
massList.value = checkBox.value;
}
} // endif massList
}

I've removed all the table formatting and other information you dont need from the block below so it just shows the checkboxes the hidden field needed to update etc




<form action="dashboard.php?LoadModule=office&sub=unassigned&action=assign" method="POST" id="UpdateForm" name="UpdateForm">
<input type="hidden" id="List2Update" name="List2Update" value="" />
<select name="AssignTo" style="width: 150px;">
<option label="JoeBlogs" value="13">JoeBlogs</option>
</select>
<input type="submit" value="Assign Now" name="actionbutton" class="button" />
<input type="button" value="Select All" class="button" onClick="checkAll(this)"/>
<input type="button" value="Deselect All" class="button" onClick="checkAll(this)"/>

<input type="checkbox" value="2846" name="assignlead" onclick="refreshMassUpdate(this)">
<input type="checkbox" value="2856" name="assignlead" onclick="refreshMassUpdate(this)">
<input type="checkbox" value="3221" name="assignlead" onclick="refreshMassUpdate(this)">
<input type="checkbox" value="3231" name="assignlead" onclick="refreshMassUpdate(this)">
</form>

rangana
08-14-2008, 12:22 PM
See if having this script helps:


function checkAll(e){
if(e.value.toLowerCase()=='select all'){
for(var i=0,assgn=document.getElementsByTagName('input');i<assgn.length;i++){
if(assgn[i].type=='checkbox'&&assgn[i].name=='assignlead'){
assgn[i].checked=true;refreshMassUpdate(assgn[i]);
}}}
else{
for(var i=0,assgn=document.getElementsByTagName('input');i<assgn.length;i++){
if(assgn[i].type=='checkbox'&&assgn[i].name=='assignlead'){
assgn[i].checked=false;refreshMassUpdate(assgn[i]);
}}}}

Arty Effem
08-14-2008, 12:44 PM
Quick search around google turned up some simple code to do it


function checkAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = true ;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}

which works great BUT because each checkbox is no longer being clicked its not calling the refreshMassUpdate(this) script and so not populating my hidden field.
Try:
function checkAll(field)
{
for (var i = 0; i < field.length; i++)
{
field[i].checked = true ;
field[i].onclick();
}
}

hinch
08-14-2008, 12:45 PM
Getting there :)

The select all and deselect all buttons now work and correctly populate the hidden field but you can no longer individually select each item (which is also needed) you now get all or nothing :)

hinch
08-14-2008, 12:52 PM
@Arty that doesn't work at all :(

abduraooft
08-14-2008, 12:56 PM
you now get all or nothing
Are you calling the the "select all"/ "desect all" function from all the checkboxes ?

hinch
08-14-2008, 01:03 PM
i want the select all / deselect all to function from 2 buttons independant of the checkboxes which they're doing with rangana's code and they're correctly populating the hidden field. But I also need the checkboxes to work independantly so it could be I only want to select and action 2-3 items not ALL items in which case i need to use or use an equivilent of the current mass update function I posted above which also correctly populates the hidden field.

I just can't get both options working together i can get one or the other working rangana's code makes the buttons work dropping rangana's code and using just mine works fine for individual buttons.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum