Html5 form validation checkboxes

Question

I want to make only one checkbox of a group of checkboxes mandatory for the user to check without using JavaScript. I have the following (quite simple) code:

<input type="checkbox" class="checkbox_condition" name="checkboxGroupName" id="first" required>
<input type="checkbox" class="checkbox_condition" name="checkboxGroupName" id="first" required>

I want to compel visitor to select one checkbox from the group. How can I do that without JavaScript? I would appreciate any recommendations.

A little more code for context may help

Andy Joiner
– Andy Joiner

2015-07-29 20:01:41 +00:00
Commented Jul 29, 2015 at 20:01 — Andy Joiner
– Andy Joiner, Commented Jul 29, 2015 at 20:01

Adam Buchanan Smith · Accepted Answer · 2015-07-29 19:39:59Z

1

Switch your checkbox to radio - radio buttons have the built in function you are looking for, in your css you can make the radio button look like a check box. see my fiddle https://jsfiddle.net/pcvwwjoe/2/

<input type="radio" class="checkbox_condition" name="checkboxGroupName" id="first" required>
  <input type="radio" class="checkbox_condition" name="checkboxGroupName" id="first">

also, notice that since both radio buttons have the same name, you only need to use required once since they are all grouped together.

answered Jul 29, 2015 at 19:39

Adam Buchanan Smith

9,4675 gold badges21 silver badges39 bronze badges

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

Collectives™ on Stack Overflow

Html5 form validation checkboxes

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related