title: HTML5 Validation of Checkbox Groups
body: <p>I &lt;3 doing validation in the browser instead of using something framework specific. Using element.setCustomValidity you can change the message shown in the tooltip. It's perfect for every element, but I don't know how to handle a checkbox group. </p>
  
  <p>Let's say you have three checkboxes, and you have to choose 2. The desired result is to have the tooltip surround the set, instructing the user to pick 2 before proceeding.</p>
  
  <p>How does html5 allow this? That's what I am always scared of, the non typical uses cases and how you can make it all work in concert with the rest of the validation behavior which is awesome (focus first invalid field, tooltips, enter keypress submission).</p>
  
  <p>Thoughts?</p>
  
  <p>Here's a snippet example.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;
  Choose your favorite two stooges.
  &lt;label&gt;Moe&lt;/label&gt;&lt;input type="checkbox" name="stooges"&gt;
  &lt;label&gt;Larry&lt;/label&gt;&lt;input type="checkbox" name="stooges"&gt;
  &lt;label&gt;Curley&lt;/label&gt;&lt;input type="checkbox" name="stooges"&gt;
  &lt;label&gt;Yes, I have agreed to this&lt;/label&gt;&lt;input required name="ack"&gt;
  &lt;button&gt;Submit&lt;/button&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>