0

I'm making a form using HTML5 validation features.

Example:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Form Test</title>
</head>
<body>
    <form id="form1" method="post" action="">
        <label><input type="checkbox" name="color1" value="1" required />Green</label><br />
        <label><input type="checkbox" name="color2" value="2" required />Red</label><br />
        <label><input type="checkbox" name="color3" value="3" required />Yellow</label><br />
        <label><input type="checkbox" name="color4" value="4" required />Blue</label><br />
        <input type="submit" /><input type="reset" />
    </form>
</body>
</html>

I need it to validate if at least one checkbox is checked.

"Must have at least one checkbox checked."

I found answer here:
Jquery - check if at least one checkbox is checked
Check if at least one checkbox is checked using jQuery
Making sure at least one checkbox is checked
Submit form only if at least one checkbox is checked

But using JavaScript, jQuery and etc.

Is possible make using HTML5 only?

Community
  • 1
  • 1
Deividson Damasio
  • 431
  • 1
  • 6
  • 15
  • User have to make a choice, right ? So, how your app will be notified of user choice without javascript or sending the data to server for verification ? So, yeah, I think it's not possible... – mickdev Feb 17 '17 at 22:44
  • If you can move the inputs outside the labels, you could try my answer here: http://stackoverflow.com/a/33842776/3903374 – Rick Hitchcock Feb 17 '17 at 22:56
  • @RickHitchcock , I will consider using your solution. Thank you very much. :-D – Deividson Damasio Feb 22 '17 at 22:36

1 Answers1

1

It is just not possible. You have to check it via JS binding a function to onchange that counts the number of checkboxes checked. required attribute for checkboxes requires that all of them are checked (as opposite for radio ones, which only need one value checked).

RompePC
  • 815
  • 1
  • 8
  • 17