JS
function toggle(source) {
checkboxes = document.getElementsByName("foo");
for(var i=0; i < checkboxes.length; i++) {
checkboxes[i].checked = source.checked;
}
}
I have 3 forms with each ID
<form id="one">
<fieldset>
<legend>Select Quarter / 2017</legend>
<input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
<input type="checkbox" name="foo" >Q1 2017<br>
<input type="checkbox" name="foo" >Q2 2017<br>
<input type="checkbox" name="foo" >Q3 2017<br>
<input type="checkbox" name="foo" >Q4 2017<br>
</fieldset>
</form>
<form id="two">
<fieldset>
<legend>Select Quarter / 2017</legend>
<input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
<input type="checkbox" name="foo" >Q1 2017<br>
<input type="checkbox" name="foo" >Q2 2017<br>
<input type="checkbox" name="foo" >Q3 2017<br>
<input type="checkbox" name="foo" >Q4 2017<br>
</fieldset>
</form>
<form id="three">
<fieldset>
<legend>Select Quarter / 2017</legend>
<input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
<input type="checkbox" name="foo" >Q1 2017<br>
<input type="checkbox" name="foo" >Q2 2017<br>
<input type="checkbox" name="foo" >Q3 2017<br>
<input type="checkbox" name="foo" >Q4 2017<br>
</fieldset>
</form>
I want to use the same javascript function to target the three different select all forms according to ID. With this function I now toggle all checkboxes, but I want to toggle all checkboxes in each form, so I don't toggle all checkboxes in all three forms at the same time. How can I do that?
Aucun commentaire:
Enregistrer un commentaire