title: Make sure checkbox is checked before submitting form?
body: <p>I have a simple &quot;terms of use&quot; checkbox set up and I want users to check it before submitting the form. I'm using the WordPress plugin &quot;WP-Polls&quot;.</p>
  <p>Here's what I've tried:</p>
  <pre><code>$('.wp-polls-form').submit(function() {
      if ($('input:checkbox', this).is(':checked')) {
          // everything is fine...
      } else {
          alert('Please agree to the Terms of Use.');
          return false;
      }
  });
  </code></pre>
  <p>The HTML:</p>
  <pre><code>&lt;form id=&quot;polls_form_1&quot; class=&quot;wp-polls-form&quot; action=&quot;/index.php&quot; method=&quot;post&quot;&gt;
      &lt;p style=&quot;display: none;&quot;&gt;&lt;input type=&quot;hidden&quot; id=&quot;poll_1_nonce&quot; name=&quot;wp-polls-nonce&quot; value=&quot;12a6404147&quot;&gt;&lt;/p&gt;
      &lt;p style=&quot;display: none;&quot;&gt;&lt;input type=&quot;hidden&quot; name=&quot;poll_id&quot; value=&quot;1&quot;&gt;&lt;/p&gt;
      &lt;div id=&quot;polls-1-ans&quot;&gt;
      &lt;ul&gt;
          &lt;li&gt;&lt;input type=&quot;radio&quot; id=&quot;poll-answer-1&quot; name=&quot;poll_1&quot; value=&quot;1&quot;&gt;&lt;/li&gt;
          &lt;li&gt;&lt;input type=&quot;radio&quot; id=&quot;poll-answer-2&quot; name=&quot;poll_1&quot; value=&quot;2&quot;&gt;&lt;/li&gt;
          &lt;li&gt;&lt;input type=&quot;radio&quot; id=&quot;poll-answer-3&quot; name=&quot;poll_1&quot; value=&quot;3&quot;&gt;&lt;/li&gt;
      &lt;/ul&gt;
  
      &lt;label class=&quot;check-terms&quot;&gt;&lt;input type=&quot;checkbox&quot;&gt;I am over 18 and I have read and understand the Terms of Use&lt;/label&gt;
  
      &lt;input type=&quot;button&quot; name=&quot;vote&quot; value=&quot;Vote&quot; class=&quot;Buttons&quot; onclick=&quot;poll_vote(1);&quot;&gt;
  </code></pre>
     
  <h2>Edit 1:</h2>
  <p>Updated it to this to include radio buttons:</p>
  <pre><code>//Make sure checkbox and radio are checked before submitting
  $('.wp-polls-form').submit(function() {
      if ($('input:checkbox', this).is(':checked') &amp;&amp;
          $('input:radio', this).is(':checked')) {
          // everything is fine...
      } else {
          alert('Please agree to the Terms of Use.');
          return false;
      }
  });
  </code></pre>
  <h2>Edit: 2</h2>
  <p>Thanks to @AnthonyGarcia. The buttons work exactly how I'd like them to, but the only problem is that the form does not submit.</p>
  <p>For the submit button, I changed the type from <code>button</code> to <code>submit</code> and also got rid of <code>onclick=&quot;poll_vote(1);&quot;</code>.</p>
  <p><code>&lt;input type=&quot;submit&quot; name=&quot;vote&quot; value=&quot;Vote&quot; class=&quot;Buttons&quot; /&gt;</code></p>
  <pre><code>$(function() {
      window.poll_vote = function(num) {
          console.log(num);
      }
      
      $('.wp-polls-form').submit(function(e) {
          
          if (!$('input:radio', this).is(':checked')) {
              alert('Please pick a beat.');
              return false;
          }
          
          if (!$('input:checkbox', this).is(':checked')) {
              alert('Please agree to the Terms of Use.');
              return false;
          }
          
          poll_vote(1);
          
          return false;
      });
  });
  </code></pre>
  <p>The live site can be seen <a href="http://staging.keebs.com" rel="nofollow noreferrer">here</a>. The relevant section is the dark voting section on top.</p>
  <h2>Edit: 3</h2>
  <p>Here is the function for <code>poll_vote()</code>. I got it from the <code>polls-js.dev.js</code> file in the plugin here: <a href="https://github.com/lesterchan/wp-polls" rel="nofollow noreferrer">https://github.com/lesterchan/wp-polls</a></p>
  <pre><code>// When User Vote For Poll
  function poll_vote(current_poll_id) {
      jQuery(document).ready(function($) {
          if(!is_being_voted) {
              set_is_being_voted(true);
              poll_id = current_poll_id;
              poll_answer_id = '';
              poll_multiple_ans = 0;
              poll_multiple_ans_count = 0;
              if($('#poll_multiple_ans_' + poll_id).length) {
                  poll_multiple_ans = parseInt($('#poll_multiple_ans_' + poll_id).val());
              }
              $('#polls_form_' + poll_id + ' input:checkbox, #polls_form_' + poll_id + ' input:radio, #polls_form_' + poll_id + ' option').each(function(i){
                  if ($(this).is(':checked') || $(this).is(':selected')) {
                      if(poll_multiple_ans &gt; 0) {
                          poll_answer_id = $(this).val() + ',' + poll_answer_id;
                          poll_multiple_ans_count++;
                      } else {
                          poll_answer_id = parseInt($(this).val());
                      }
                  }
              });
              if(poll_multiple_ans &gt; 0) {
                  if(poll_multiple_ans_count &gt; 0 &amp;&amp; poll_multiple_ans_count &lt;= poll_multiple_ans) {
                      poll_answer_id = poll_answer_id.substring(0, (poll_answer_id.length-1));
                      poll_process();
                  } else if(poll_multiple_ans_count == 0) {
                      set_is_being_voted(false);
                      alert(pollsL10n.text_valid);
                  } else {
                      set_is_being_voted(false);
                      alert(pollsL10n.text_multiple + ' ' + poll_multiple_ans);
                  }
              } else {
                  if(poll_answer_id &gt; 0) {
                      poll_process();
                  } else {
                      set_is_being_voted(false);
                      alert(pollsL10n.text_valid);
                  }
              }
          } else {
              alert(pollsL10n.text_wait);
          }
      });
  }
  </code></pre>