Disable some checkboxes

Bob Bedford

I create checkboxes using datas from a database (with PHP).
I store all values in an array, as I must pass this value like a Form value.

Now, in some cases, when a checkbox is selected, I must disactivate other
checkboxes.

How can I do this ?

here is the code:

print("<TR><TD valign=\"top\"><input type=\"checkbox\" name=\"details[]\"
value=\"".$row_Recordset->ID."\"></TD><TD
valign=\"top\">".$row_Recordset->Description);

here is the output: [] is for checkbox
[] Blue
[]
[]
[]
[]

Jul 23 '05 #1

Follow Post Reply

5834

Martin Honnen

Bob Bedford wrote:

I create checkboxes using datas from a database (with PHP).
I store all values in an array, as I must pass this value like a Form value.

Now, in some cases, when a checkbox is selected, I must disactivate other
checkboxes.

How can I do this ?

here is the code:

print("<TR><TD valign=\"top\"><input type=\"checkbox\" name=\"details[]\"
value=\"".$row_Recordset->ID."\"></TD><TD
valign=\"top\">".$row_Recordset->Description);

Here is an example:

<html lang="en">
<head>
<title>checkbox disabling</title>
<script type="text/javascript">
function disableHandler (form, inputName) {
var inputs = form.elements[inputName];
for (var i = 0; i < inputs.length; i++) {
var input = inputs[i];
input.onclick = function (evt) {
if (this.checked) {
disableInputs(this, inputs);
}
else {
enableInputs(this, inputs);
}
return true;
};
}
}

function disableInputs (input, inputs) {
for (var i = 0; i < inputs.length; i++) {
var currentInput = inputs[i];
if (currentInput != input) {
currentInput.disabled = true;
}
}
}

function enableInputs (input, inputs) {
for (var i = 0; i < inputs.length; i++) {
var currentInput = inputs[i];
if (currentInput != input) {
currentInput.disabled = false;
}
}
}
</script>
</head>
<body>
<form name="aForm" action="">
<p>
<label>
Blue
<input type="checkbox" name="details[]" value="blue">
</label>
<label>
Green
<input type="checkbox" name="details[]" value="green">
</label>
<label>
Red
<input type="checkbox" name="details[]" value="red">
</label>
</p>
</form>
<script type="text/javascript">
disableHandler(document.forms.aForm, 'details[]');
</script>
</body>
</html>

Disabling form controls works in browsers like Netscape 6/7, IE4+, Opera
7 but not old ones like Netscape 4.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2

Bob Bedford

Thanks for your code, Martin, but all checkboxes belong to the same array
(details[]) but this is not for grouping: the groups are different:

//1st group (colors)
[] Blue
[] Green
[] Red
[] Purple
//2nd group (size)
[] Big
[] Small
//3rd group (weight)
[] Heavy
[] Light

So clicking on any color item, it should disable all other colors items, but
not size and weight items
Also, one more difficulty, any item may be in different groups, so clicking
on any will disable all of his group.

So forget the previous example and take this better one: (all items must
have the name="details[]").
[] item1 (belong to group 1,2,4)
[] item2 (belong to group 1,2,4)
[] item3 (belong to group 1,2,4)
[] item4 (belong to group 1,3)
[] item5 (belong to group 3)
[] item6 (belong to group 4)

So:
clicking on item1, disable items 2,3,4,6
clicking on item2, disable items 1,3,4,5
clicking on item3, disable items 1,2,4,5
clicking on item4, disable items 1,2,3,5
clicking on item5, disable items 4 only
clicking on item6, disable items 1,2,3

I know it's quite complex !!!! how to do so ????

BoB

Jul 23 '05 #3

Martin Honnen

Bob Bedford wrote:

So forget the previous example and take this better one: (all items must
have the name="details[]").
[] item1 (belong to group 1,2,4)
[] item2 (belong to group 1,2,4)
[] item3 (belong to group 1,2,4)
[] item4 (belong to group 1,3)
[] item5 (belong to group 3)
[] item6 (belong to group 4)

So:
clicking on item1, disable items 2,3,4,6
clicking on item2, disable items 1,3,4,5
clicking on item3, disable items 1,2,4,5
clicking on item4, disable items 1,2,3,5
clicking on item5, disable items 4 only
clicking on item6, disable items 1,2,3

I know it's quite complex !!!! how to do so ????

Well there is the onclick handler to attach code to be called when the
input is clicked, the checked property to find out whether the checkbox
is checked and the disabled property to disable a property so you need
<input type="checkbox"
name="details[]"
onclick="if (this.checked) {
//disable needed inputs
this.form.elements[this.name][1].disabled = true;
}
else {
//enabled needed inputs e.g.
this.form.elements[this.name][1].disabled = false;
}
return true;">

It is up to you now to write down the code for the different checkboxes.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #4

Bob Bedford

"Martin Honnen" <ma*******@yahoo.de> a écrit dans le message de
news:40********@olaf.komtel.net...

Bob Bedford wrote:

So forget the previous example and take this better one: (all items must
have the name="details[]").
[] item1 (belong to group 1,2,4)
[] item2 (belong to group 1,2,4)
[] item3 (belong to group 1,2,4)
[] item4 (belong to group 1,3)
[] item5 (belong to group 3)
[] item6 (belong to group 4)

So:
clicking on item1, disable items 2,3,4,6
clicking on item2, disable items 1,3,4,5
clicking on item3, disable items 1,2,4,5
clicking on item4, disable items 1,2,3,5
clicking on item5, disable items 4 only
clicking on item6, disable items 1,2,3

I know it's quite complex !!!! how to do so ????

Well there is the onclick handler to attach code to be called when the
input is clicked, the checked property to find out whether the checkbox
is checked and the disabled property to disable a property so you need
<input type="checkbox"
name="details[]"
onclick="if (this.checked) {
//disable needed inputs
this.form.elements[this.name][1].disabled = true;
}
else {
//enabled needed inputs e.g.
this.form.elements[this.name][1].disabled = false;
}
return true;">

It is up to you now to write down the code for the different checkboxes.

How can I add an array to any details item and then go trough any item when
a box is checked ?

article[0] = item1 (value=123, exclude=(233,432,456))
article[1] = item2 (value=233, exclude=(432,456))
article[2] = item3 (value=455, exclude=(457,477,874))
....
so clicking on any item, it should look at his exclude list, and then go
trough all article's item and retrieve the one wich value = any of the
existing exclude number and disable it! also the ability to enable it again
if the article is unchecked.

How to do so in Javascript ?

Jul 23 '05 #5

Martin Honnen

Bob Bedford wrote:

How can I add an array to any details item and then go trough any item when
a box is checked ? How to do so in Javascript ?

The JavaScript docs are at
http://devedge.netscape.com/library/...1.5/reference/
the Array reference at
http://devedge.netscape.com/library/...y.html#1193137
there is also a guide at
http://devedge.netscape.com/library/...ipt/1.5/guide/
treating arrays here
http://devedge.netscape.com/library/...j.html#1008453
Now try to write some code yourself
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #6

Disable some checkboxes

This discussion thread is closed

Similar topics