childnodes > checkboxes

[phorcon3]

<div id="scroll">
<div><input type="checkbox" name="test[]" value="0" onClick="clickBox(0);" /></div>
<div><input type="checkbox" name="test[]" value="1" onClick="clickBox(1);" /></div>
<div><input type="checkbox" name="test[]" value="2" onClick="clickBox(2);" /></div>
<div><input type="checkbox" name="test[]" value="3" onClick="clickBox(3);" /></div>
</div>

<div>You have <span id="count">0</span> checkboxes out of 3 selected.

 

so, what I wanna do is:

 

a) When a checkbox is selected, I want to update the <span id="count">0</span>

 

document.getElementById('count').innerHTML = total;

 

b) You can only select 3 out of the 4 checkboxes

 

c) When someone deselects a checkbox I, of course wanna update the <span id="count">0</span>

 

does anyone know how to do this?

 

 

[phpQuestioner]

<script language="javascript">
var total="0";
function clickBox(what,which)
{
var whichone = document.getElementById(which).checked;
if (whichone == true)
{
total++;
}
else {
total--;
}
if (total <= 3) {
document.getElementById('count').innerHTML = total;
}
else {
alert("You May Only Select Three Of These");
document.getElementById(which).checked = false;
}
}
</script>

<div id="scroll">
<div><input type="checkbox" id="test1" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test2" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test3" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test4" value="1" onClick="clickBox(this.value,this.id);" /></div>
</div>

<div>You have <span id="count">0</span> checkboxes out of 3 selected.

[phpQuestioner]

UPDATE

 

Do it like this instead; I did not factor in something in the previous script.

 

<script language="javascript">
var total="0";
function clickBox(what,which)
{
var whichone = document.getElementById(which).checked;
if (whichone == true)
{
total++;
}
else {
total--;
}
if (total <= 3) {
document.getElementById('count').innerHTML = total;
}
else {
alert("You May Only Select Three Of These");
document.getElementById(which).checked = false;
total=total-1;
}
}
</script>

<div id="scroll">
<div><input type="checkbox" id="test1" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test2" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test3" value="1" onClick="clickBox(this.value,this.id);" /></div>
<div><input type="checkbox" id="test4" value="1" onClick="clickBox(this.value,this.id);" /></div>
</div>

<div>You have <span id="count">0</span> checkboxes out of 3 selected.

[phorcon3]

geesh, thanks!! it works perfect!! i love it, thanks alot;)

[phpQuestioner]

 

Your Welcome