Technique to dynamically set mutiple checkboxes, mixing javascript and php forms

Question

I'm new to javascript, my problem is effectively: I have a php page that produces a single form with multiple process blocks or sections, each with a group of checkboxes

eg

<form action='./this.php' method='POST'>
One<br>
<input type='checkbox' name='one[part1]'>a<br>
<input type='checkbox' name='one[part2]'>b<br>
<input type='checkbox' name='one[part3]'>c<br>

<input type='checkbox' name='one[all]'>all<br>
<br>
Two<br>
<input type='checkbox' name='two[part1]'>a<br>
<input type='checkbox' name='two[part2]'>b<br>
<input type='checkbox' name='two[part3]'>c<br>

<input type='checkbox' name='two[all]'>all<br>

<input type='submit'>
</form>

Example problem: I want to be able to click on the two[all] checkbox and have two[part1],two[part2], and two[part3] all become checked.

If I name all the checkboxes in the group the same, the php post value will only show up for one, so I need to keep the names different.

Is there any simple method for doing this, short of dynamically(through php) producing separate onclick functions for each section.

Note, not all sections will be the same, sometimes one.part1 may not be available for checking but its information will be shown and the checkbox names will start from b onwards.

Or maybe traversing the DOM to find all checkboxes after a start marker and before the check all.

Hopefully that is clear enough.

You can use jQuery with some selector magic to select the [all] ones and the corresponding checkboxes. Then match their click events. Shouldn't be too difficult. (Too busy to do now; anyone, feel free to do it yourself.) — strager
– strager, Commented Feb 13, 2009 at 0:27

lsl · Accepted Answer · 2009-02-13 01:28:48Z

2

Changed the form to be more like:

<input type='checkbox' name='section[one][]' value='part1'>a<br>
<input type='checkbox' name='section[one][]' value='part2'>b<br>
<input type='checkbox' name='section[one][]' value='part3'>c<br>

<input type='checkbox' name='one[all]' onclick='checkAll(one,this)>all<br>

CheckAll function was:

function checkAll(checkid, exby) {
    boxes = document.getElementsByName('section[' + checkid + '][]');
    for (i = 0; i < boxes.length; i++){
        boxes[i].checked = exby.checked? true:false
    }
}

This ends up still giving the manageable array in the php post var while having a singular name.

answered Feb 13, 2009 at 1:28

lsl

4,4193 gold badges41 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

achinda99 · Accepted Answer · 2009-02-13 00:23:16Z

0

You need one javascript onClickAll function that takes a parameter of the group name. You can then loop through each checkbox returned by getElementsByName and mark them checked/unchecked. On the postback, you will get an array of values for the checkboxes with the group name used. By looping through, you know which was checked and which wasn't.

I'd write some sample code but its been a while since I've worked in PHP/Javascript that I think its better that someone who's better do it. But what I told you should the the gist of it. Good luck!

answered Feb 13, 2009 at 0:23

achinda99

5,0784 gold badges37 silver badges42 bronze badges

Collectives™ on Stack Overflow

Technique to dynamically set mutiple checkboxes, mixing javascript and php forms

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related