Check a checkbox - subgroups of subgroups

[schase]

Hi folks,

I've got a page that is dynamically written (asp) It breaks out like this

Country 1
- Section/District 1
- Town 1
- Town 2
- Town 3
- Section/District 2
- Town 1
- Town 2
Country 2
- Section/District 1
- Town 1
- Town 2
- Section/District 2
- Town 1
- Town 2

each country/district/town has a checkbox next to it.

What I'd like to do - is if a person clicks a checkbox next to a country - every district & town is also checked (or unchecked if unchecked). And if instead the user decides to check say only District 1 in Country 1 than all Towns in District 1 are checked/unchecked.

In addition, it'd be neat if one particular town is unchecked than the country/district unchecks itself - but leaves anything checked - checked.

I've found some to do portions of that - but not two levels deep as I need. I can write out the checkboxes in any manner necessary.

Does anyone have an idea on how to do this? my JavaScript abilities are next to none.

Thank you in advance.

Stuart

 

[vbkris]

>>I've got a page that is dynamically written (asp) It breaks out like this


what naming convetions did u follow while creating the checkboxes???

Known is handfull, Unknown is worldfull

 

[schase]

Hi,

Thank you for your reply.

I can follow anything that may fit code, for the meanwhile I had done something like

C<%=strCount%>_D<%=strCount2%>_T<%=strCount3%>

strCount being the country's loop position
strCount2 being districts loop position
strCount3 being the towns loop position

But anything will work, if all checkbox's are named the same that's fine too I'll just split them for insertion into database later on.


Stuart

 

[schase]

I did find this, which will check the group, subgroup and lowest layer if either the group or subgroup is checked.

http://www.codingforums.com/archive/index.php?t-31042.html

Works great - the only thing it doesn't do, is if I uncheck a town than the corresponding Country / District do not uncheck as well.

Not too necessary I suppose - but if it could do that, it would turn great code into elegant code.

<script>
/*great code via [URL unfurl="true"]http://www.codingforums.com/archive/index.php?t-31042.html[/URL]
/*Danne 1-5-2004
function check(f,isChild) {
/* Returns an array with children inputs */
function getChildren(f) {
var childContainer=f.nextSibling;
while (childContainer && childContainer.tagName!="DIV") {
childContainer=childContainer.nextSibling;
}
if (childContainer) {
return childContainer.getElementsByTagName("INPUT");
} else {
return [];
}
}
/* Checks / unchecks all parents */
function checkParent(f,checked) {
var p=f.parentNode.previousSibling;
while (p && p.tagName!="INPUT") {
p=p.previousSibling;
}
if (p) {
var fields=getChildren(p);
for (var i = 0; i < fields.length; i++) {
if (!fields[ i ].checked) {
checked=false;
}
}
p.checked=checked;
checkParent(p,checked);
}
}

var checked=f.checked;

/* Check / uncheck all children */
var fields=getChildren(f);
for (var i = 0; i < fields.length; i++) {
fields[ i ].checked = checked;
check(fields[ i ],true);
}

/* Verify the state of the parents to calling node */
if (typeof isChild=="undefined") {
checkParent(f,checked);
}
}
</script>

and the form bits - using that pages as an example

<div class="section">
<input type="checkbox" id="firstsection" onclick="check(this);"> Section One
<div class="subsection">
<input type="checkbox" id="firstsubsection" onclick="check(this);"> Subsection One
<div class="file">
<input type="checkbox" onclick="check(this);"> File One
<input type="checkbox" onclick="check(this);"> File Two
</div>
<input type="checkbox" id="secondsubsection" onclick="check(this);"> Subsection Two
<div class="file">
<input type="checkbox" onclick="check(this);"> File One
<input type="checkbox" onclick="check(this);"> File Two
</div>
</div>
</div>
<div class="section">
<input type="checkbox" id="secondsection" onclick="check(this);"> Section Two
</div>

Stuart