PDA

Click to See Complete Forum and Search --> : check box problem

jasonymk
09-17-2003, 09:39 PM
hi all,

i have a page which have somecheck box, but the names are variable. e.g
<input type="checkbox" name="baaks">

i have a function which is use to check the checkboes which are in the same group when a checkbox named"masterselect" is clicked, here is the function:

<br/>
function toggleSelect(sth) {
var num=0,e;
for (var j=0;j<sth.length;j++) {
e=sth.elements[j];
if (e.type=="checkbox" && e.name == "baaks") num++;
}
if (sth.masterSelect.checked) {
if (num==1) {
sth.baaks.checked = true;
} else {
for (var i=0;i<num;i++) {
sth.baaks[i].checked = true
}
}
} else {
if (num==1) {
sth.baaks.checked = false;
} else {
for (var i=0;i<num;i++) {
sth.baaks[i].checked = false
}
}
}
}
<br/>

here comes the question, what should i do if the name of the checkbox is variable?

for example,
sth.x[i].checked = true(this is wrong cos i have tried)

where x is a variable input to the function?
urgent, please help~~~
Khalid Ali
09-17-2003, 09:48 PM
????:confused: :confused:

May be post the link to the pages and describea scenario and the result you are expecting and the error that you get....
jasonymk
09-17-2003, 09:55 PM
sorry for i dun have a link avaliable for the page.....
but anyway...thanks for replying let me describe the situation again.....

here is the original code:

<html>
<head>
<title>Dealing with Checkboxes</title>
<script type="text/javascript">
<!--
function toggleSelect(sth) {
var num=0,e;
for (var j=0;j<sth.length;j++) {
e=sth.elements[j];
if (e.type=="checkbox" && e.name == "baaks") num++;
// check the number of target checkboxes... though it's unneccessary in this sample coz everything is static and the number of target checkboxes is known...
}
if (sth.masterSelect.checked) {
if (num==1) {
sth.baaks.checked = true;
} else {
for (var i=0;i<num;i++) {
sth.baaks[i].checked = true
}
}
} else {
if (num==1) {
sth.baaks.checked = false;
} else {
for (var i=0;i<num;i++) {
sth.baaks[i].checked = false
}
}
}
}
-->
</script>
</head>
<body>
<form>
<table cellpadding="3" cellspacing="0" border="0">
<tr>
<td>Checkbox 1: </td>
<td><input type="checkbox" name="baaks"></td>
</tr>
<tr>
<td>Checkbox 2: </td>
<td><input type="checkbox" name="baaks"></td>
</tr>
<tr>
<td>Checkbox 3: </td>
<td><input type="checkbox" name="baaks"></td>
</tr>
<tr>
<td>Checkbox 4: </td>
<td><input type="checkbox" name="baaks"></td>
</tr>
<tr>
<td>Checkbox 5: </td>
<td><input type="checkbox" name="baaks"></td>
</tr>
<tr>
<th>Select/Deselect All: </th>
<td><input type="checkbox" name="masterSelect" onClick="javascript:toggleSelect(this.form);"></td>
</tr>
</form>
</body>
</html>

for the above page, if the checkbox"masterselect" is clicked, the 5 checkboxes will be checked.
what i wanna do is to change the function so that i can do things like toggleSelect(this.form,checkboxname), where checkboxname = "baaks".

hope you understand...thnak you so much
Khalid Ali
09-17-2003, 10:00 PM
what exactly are you expecting from toggleSelect( will it select only one checkbox that is passed as parameter to it?) and what is the
sth parameter
jasonymk
09-17-2003, 10:07 PM
sorry for confusing you,

toggleselect will check all the five checkboxes named" baaks".
when masterselect is checked.

what i wanna do is to change all the "baaks" in the function to be a input .....so that i can have aother group of checkboxes.

and i can use the function like toggleSelect(this.form, "baaks")
Khalid Ali
09-17-2003, 11:03 PM
ahh ok..if you name first group of check boxes baaks
they will all automatically be in an array called baaks.

then the next group could becks
the other one can be coors
...............................coors light and so on..
and in the toggleSelect you may only want to pass the value

tooggleSelect("baaks")

and inthe functions add these lines
function toggleSelect(value){
var cbArray = eval('document.formName.'+value);

//now cbArray is the object you can access its element
jasonymk
09-17-2003, 11:34 PM
thanks so much khalid!~~

by the way, while i am waiting, i have search one example which looks like another solution for the question:

<HTML>
<HEAD>
<STYLE>

</STYLE>
<SCRIPT>
function oneOrNoCheckboxGroup (checkbox) {
var checkboxGroup = checkbox.form[checkbox.name];
for (var c = 0; c < checkboxGroup.length; c++)
if (checkboxGroup[c] != checkbox)
checkboxGroup[c].checked = false;
}
function radioCheckboxGroup (checkbox) {
var checkboxGroup = checkbox.form[checkbox.name];
for (var c = 0; c < checkboxGroup.length; c++)
if (checkboxGroup[c] != checkbox)
checkboxGroup[c].checked = false;
return checkbox.checked;
}
</SCRIPT>
</HEAD>
<BODY>

<FORM NAME="formName">
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Kibo"
ONCLICK="oneOrNoCheckboxGroup(this);"
>
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Xibo"
ONCLICK="oneOrNoCheckboxGroup(this);"
>
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Maho"
ONCLICK="oneOrNoCheckboxGroup(this);"
>
</FORM>
<FORM NAME="formName">
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Kibo"
ONCLICK="return radioCheckboxGroup(this);"
>
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Xibo"
ONCLICK="return radioCheckboxGroup(this);"
>
<INPUT TYPE="checkbox" NAME="aCheckBox" VALUE="Maho"
ONCLICK="return radioCheckboxGroup(this);"
>
</FORM>
</BODY>
</HTML>


i just wanna ask what is the meaning of ms.form[ms.name]
what is the usage and what actually this code represent?(is it this.form[this.name]? or this.form.aCheckBox[this.form.aCheckBox.name]?

seems so confusing to me....
Khalid Ali
09-17-2003, 11:44 PM
its a actually a bit of overkill it will like this as well

var checkboxGroup = checkbox;

in the code above we are referencing the check box array and thats what the original code is doing as well