Question

I have a website with a series of empty text fields that the user can edit. Next to each text field is a check box as follows:

<input type="text" id="textfield1" size="60" /><input type="checkbox"> <br />
<input type="text" id="textfield2" size="60" /><input type="checkbox"> <br />
<input type="text" id="textfield3" size="60" /><input type="checkbox"> <br />

Once a user clicks submit, is there a way of iterating through the textinput and checkbox pair on a line by line basis?

for example, is it possible to somehow group the textfield and check box together and iterate through these groups going group.textfield.value =? and group.checkbox.value = ?

I need an easy way to determine the text of a field and whether or not that particular field had it’s check box selected

Answer 1

Just iterate through the text inputs, and use .nextSibling to grab each adjacent checkbox.

Make sure you don’t introduce any whitespace between them.

---

Another option is to group them in fieldset elements…

<fieldset>
    <input type="text" id="textfield1" size="60" /><input type="checkbox">
</fieldset>
<fieldset>
    <input type="text" id="textfield2" size="60" /><input type="checkbox">
</fieldset>
<fieldset>
    <input type="text" id="textfield3" size="60" /><input type="checkbox">
</fieldset>

…then iterate the fieldset elements, and use .children[0] and .children[1]