Forms with label checkbox, checking only first checkbox

Question

<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>
<form>
    <label for="cPendrive"><input type="checkbox" name="wyposazenie[]" value="Pendrive" id="cPendrive"/><span>Pendrive</span></label>
</form>

http://jsfiddle.net/4e9tjtL9/

I have problem, then press anything checbox/label always is selected only first checkbox, not checkbox inside form.

Where is problem?

I would like not use javascript and generate random names for atrribute 'for' and 'id'.

you have command id's for all checkboxes, change it to classes, ID should be unique. — Mritunjay
– Mritunjay, Commented Sep 14, 2014 at 17:40
@Mritunjay — The for attribute of a label keys off the id. — Quentin
– Quentin, Commented Sep 14, 2014 at 18:37

Quentin · Accepted Answer · 2014-09-14 17:45:33Z

1

Your HTML is invalid. An id must be unique in a page.

When you click on a label, the browser looks for the element with the matching id. It stops after it is found it (so it always finds the first one).

Make your ids unique.

I would like not use javascript and generate random names for atrribute 'for' and 'id'.

You don't have to use JavaScript (you can use any programming language on the server, or at build time, or you can write them by hand) and the values don't have to be random (a sequential number on the end will do fine).

answered Sep 14, 2014 at 17:45

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

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

1 Comment

Peter Over a year ago

Ok, because I thinked, that ID can be that same in form. But is right, that ID must be unique in a page.

Collectives™ on Stack Overflow

Forms with label checkbox, checking only first checkbox

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related