View Full Version : check all different name's checkbox
Can anyone help me??
how to check different name's checkbox,
for example:
Ticket checkbox1 checkbox2 checkbox3 select all(this can select all checkbox1 checkbox2 checkbox3)
Tour ¡@ checkbox1 checkbox2 checkbox3 select all
Travel checkbox1 checkbox2 checkbox3 select all
¡@¡@¡@¡@¡@select all select all select all
¡@¡@¡@¡@¡@(this can select all checkbox1)
what should i do to have this kind of function??
any one understand what i mean??:( :(
Not exactly sure if I understand your question but try this
<script language="JavaScript">
<!--
function checkAll(theForm) {
for (i=0;i<theForm.elements.length;i++)
if (theForm.elements[i].name.indexOf('chk') !=-1)
theForm.elements[i].checked = true;
}
function uncheckAll(theForm) {
for (i=0;i<theForm.elements.length;i++)
if (theForm.elements[i].name.indexOf('chk') !=-1)
theForm.elements[i].checked = false;
}
//-->
</script>
<form name=theForm>
<input type="checkbox" name=chk>
<input type="checkbox" name=chk>
<input type="checkbox" name=chk>
<input type="checkbox" name=chk>
<input type="checkbox" name=chk>
<input type="checkbox" name=chk>
<P><input type="button" name=but1 value="All" onClick="checkAll(this.form);"> <input type="button" name=but2 value="None" onClick="uncheckAll(this.form);">
</form>
thanks for reply,but what i mean is.....
<form name=theForm>
<table>
<tr>
<td><input type="checkbox" name=chk1> </td>
<td><input type="checkbox" name=chk2> </td>
<td><input type="checkbox" name=chk3> </td>
<td><input type="checkbox" name=chk4> </td>
<td><input type="checkbox" name=chk5> </td>
<td><input type="checkbox" name=chk6> </td>
<td><input type="button" value="Check all" name="checkall">
<!--- this checkall button can check different name's checkbox"-->
</tr>
<tr>
<td><a href="javascript:selallticket(this.form)">checkallchk1</a></td><!--this can select all chk1-->
<td><a href="javascript:selallFticket(this.form)">checkallchk2</a></td>><!--this can select all chk2-->
<td><a href="javascript:selallTFit(this.form)">checkallchk3</a></td>><!--this can select all chk3-->
<td><a href="javascript:selallFFit(this.form)">checkallchk4</a></td>><!--this can select all chk4-->
<td><a href="javascript:selallTtour(this.form)">checkallchk5</a></td>><!--this can select all chk5-->
<td><a href="javascript:selallFtour(this.form)">checkallchk6</a></td>><!--this can select all chk5-->
<td></td>
</tr>
</table>
is this more clear??
RadarBob
02-15-2003, 04:48 AM
so you have several checkboxes named "chk1", several named "chk2", etc. ??
<input type="checkbox" name="chk1" >
. . . // several more exactly the same, named "chk1"
<input type="button" name="checkall1" onclick="checkAll(thisdocument.formName.chk1);"
<input type="checkbox" name="chk2" onclick="checkAll(document.formName.chk2);">
. . . // several more named "chk2"
and so on...
<script type="text/javascript">
function checkAll (theCheckList) {
for (var i=0; i < theCheckList.length; i++) {
theCheckList[i].checked = true;
}
} // checkAll()
</script>
thanks for reply,
but how do u check for different name?
like..
<input type="checkbox" name="chk1" >
<input type="checkbox" name="chk2" >
<input type="checkbox" name="chk3" >
<input type="checkbox" name="checkchk1chk2chk3" >
When you say check for a different name do you mean check which box is check even if all names are the same.
Try this
<script>
<!--
function testme(){
for(i=0;i<document.forms[0].length;i++){
if(document.forms[0].elements[i].type=="checkbox"&&document.forms[0].elements[i].checked){
alert("You have checked box "+(i+1))
}
}
}
// -->
</script>
<form>
<input type="checkbox" value="chk1" onclick="testme()"><BR>
<input type="checkbox" value="chk1" onclick="testme()"><BR>
<input type="checkbox" value="chk1" onclick="testme()"><BR>
<input type="checkbox" value="chk1" onclick="testme()"><BR>
</form>
Or
how about this one
<script language="Javascript">
<!--
chkbox= new Array()
function check(){
oSPAN.innerText=""
for (i = 0; i < document.ChkBox.length; i++) { // list form elements
if (document.ChkBox[i].type == "checkbox"){ // tag checkboxes
chkbox[i]=i
if(document.ChkBox.elements[chkbox[i]].checked==true){ // if checked
oSPAN.innerHTML+="Checkbox "+(i+1)+" Is <font color='red'><b>Checked</b></font><br>"
}
else{ // if not checked
oSPAN.innerHTML+="Checkbox "+(i+1)+" Is Not Checked<br>"
}
}
}
}
// -->
</script>
<center>
<table border="1" width="350" cellpadding="5">
<tr><td align="right">
<form name="ChkBox" onclick="check()">
Checkbox 1 <input type="checkbox" name="chkbox0"><BR>
Checkbox 2 <input type="checkbox" name="chkbox1"><BR>
Checkbox 3 <input type="checkbox" name="chkbox2"><BR>
Checkbox 4 <input type="checkbox" name="chkbox3"><BR>
</form>
</td>
<td valign="top" width="200">
<span id="oSPAN"></span></td>
</tr></table>
</center>
beetle
02-17-2003, 08:16 PM
I have a function I've used several times that allows you to pass unlimited checkbox names. Won't generate errors of the checkbox doesn't exist either...function toggleChecks( f, toggle )
{
for ( var i = 2; i < arguments.length; i++ )
{
cbGroup = f.elements[arguments[i]];
if ( typeof cbGroup == 'undefined' ) continue;
if ( cbGroup.length > 1 )
{
for ( var j = 0; ( cb = cbGroup[j] ); j++ )
{
cb.checked = toggle;
}
}
else
{
cbGroup.checked = toggle;
}
}
}Here's how you call it<input type="checkbox" onClick="toggleChecks( this.form, this.checked, 'chk1','chk2','chk3' )" />
<input type="checkbox" name="chk1" >
<input type="checkbox" name="chk2" >
<input type="checkbox" name="chk3" > If any or all of them are arrays, it will check each of those as well.
thanks for all ur reply,
what i mean not check which box is checked and not check all chk1,chk2,chk3 checkbox
what i mean is
chk1 chk2 chk3 chk4 checkbox
if i check checkbox,chk1,chk2,chk3,chk4 will be checked..
but just one of chk1,chk2,chk3,chk4,not all of chk1,chk2,chk3,chk4.
or i put this way to say,
chk1[i] chk2[i] chk3[i] chk4[i] checkbox[i]
if i check checkbox[1] then chk1[1],chk2[1],chk3[1],chk4[1] will be checked.
understand what i mean??i have tried several times,but can't work.
hope someone understand!!:( :(
Skyzyx
02-18-2003, 08:24 AM
Part 1: Here's a script I randomly wrote today...
// "SkyCheck" 1.0, by Skyzyx Genesis...
function checkbox(nameOfForm)
{
// Store variables.
this.nameOfForm=(parseInt(nameOfForm)) ? nameOfForm:'"'+nameOfForm+'"';
this.toggleOnOff=1;
// Can be used externally, but meant for internal use only.
this.set=function(bool)
{
if (document.forms && document.getElementsByTagName)
{
var theFields=eval('document.forms['+this.nameOfForm+'].getElementsByTagName("input");');
var theFieldsLen=theFields.length;
for (i=0; i<theFieldsLen; i++)
{
if (theFields[i].getAttribute("type") == "checkbox")
{
theFields[i].checked=bool;
}
}
}
else alert('Not Supported');
}
// Basic functions to use externally.
this.check=function() { this.set(true); }
this.clear=function() { this.set(false); }
// Just a nifty little feature.
this.toggle=function()
{
if (this.toggleOnOff) { this.set(true); this.toggleOnOff=0; }
else if (!this.toggleOnOff) { this.set(false); this.toggleOnOff=1; }
}
}
You'd use it like this:
var chkBox=new checkbox('test'); // Assuming the name of your form is <form name="test">
chkBox.check();
chkBox.clear();
chkBox.toggle();
***************************************
Part 2: I would suggest that for the functionality you're talking about, you should separate them into different forms...
Or...
<script language="javascript" type="text/javascript">
<!--
function check1()
{
document.test.checkbox1_1.checked=true;
document.test.chk1_1.checked=true;
document.test.chk2_1.checked=true;
document.test.chk3_1.checked=true;
}
function check2()
{
document.test.checkbox1_2.checked=true;
document.test.chk1_2.checked=true;
document.test.chk2_2.checked=true;
document.test.chk3_2.checked=true;
}
//-->
</script>
<form name="test" action="#" method="post">
<input type="checkbox" name="checkbox1_1" onclick="check1();">Checkbox 1<br>
<input type="checkbox" name="chk1_1">Chk 1<br>
<input type="checkbox" name="chk2_1">Chk 2<br>
<input type="checkbox" name="chk3_1">Chk 3<br>
<br><br>
<input type="checkbox" name="checkbox1_2" onclick="check2();">Checkbox 1<br>
<input type="checkbox" name="chk1_2">Chk 1<br>
<input type="checkbox" name="chk2_2">Chk 2<br>
<input type="checkbox" name="chk3_2">Chk 3<br>
</form>
I would still suggest you create separate forms, but if you're insistant, the second script works too...
RadarBob
02-18-2003, 01:37 PM
this may be close.
I've created a javascript object I call groupbox. The 'group' has N number of checkboxes all of which you can independently mark or unmark (just like a checkbox should work!). Additionally there is a 'none of the above' checkbox. If I mark this 'none of the above' box, every box in the 'group' gets unmarked automatically. Likewise if any choces from the group are checked, then the 'none of the above' box is automatically unmarked.
I use this for a survey where some answers have an explicit "none of the above" choice. This object enforces data integrity. Doesn't make sense to choose from the group and 'none' at the same time.
My 'none of the above' box could easily be a 'select all of the above' or even a 'toggle'.
You may have cracked it there Beetle
:thumbsup:
beetle
02-18-2003, 08:29 PM
I'm thinking this is it...<html>
<head>
<title>cbs!</title>
<script type="text/javascript">
function checkEquiv( cb )
{
var toggle = cb.checked;
var f = cb.form;
var cbGroup = f.elements[cb.name];
var i = 0;
while( cbGroup[i] !== cb )
i++;
for ( j = 1; ( arg = arguments[j] ); j++ )
f.elements[arg][i].checked = toggle;
}
</script>
</head>
<body>
<form>
<input type="checkbox" name="cbox" onclick="checkEquiv( this, 'cbox1', 'cbox2', 'cbox3', 'cbox4' )" />
<input type="checkbox" name="cbox" onclick="checkEquiv( this, 'cbox1', 'cbox2', 'cbox3', 'cbox4' )" />
<input type="checkbox" name="cbox" onclick="checkEquiv( this, 'cbox1', 'cbox2', 'cbox3', 'cbox4' )" />
<hr />
<input type="checkbox" name="cbox1" />
<input type="checkbox" name="cbox1" />
<input type="checkbox" name="cbox1" />
<hr />
<input type="checkbox" name="cbox2" />
<input type="checkbox" name="cbox2" />
<input type="checkbox" name="cbox2" />
<hr />
<input type="checkbox" name="cbox3" />
<input type="checkbox" name="cbox3" />
<input type="checkbox" name="cbox3" />
<hr />
<input type="checkbox" name="cbox4" />
<input type="checkbox" name="cbox4" />
<input type="checkbox" name="cbox4" />
</form>
</body>
</html>
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.