title: JQM (jQueryMobile) HTML5 pattern validation with Alternate button type (Not Submit)
body: <p>Using HTML5 Pattern for form field validation, how does one stop a submission if the form is invalid? Maybe I should ask, how does one create a custom valid/invalid form handler? </p>
  
  <p><a href="http://jquerymobile.com/demos/1.0a4.1/#docs/api/methods.html" rel="nofollow">Documentation</a> on the changePage()</p>
  
  <pre><code>$('#form-submit-button').click( function() {
      event.preventDefault(); // This is undefined                    
  
          // This submits my form and values via ajax, handles page transition
      $.mobile.changePage({
          url: 'request.php?page=one', 
          type: 'post', 
          data: $('form#test_form').serialize()
      },'slide',false,false);
  }); 
  </code></pre>
  
  <p>Example HTML Form Field</p>
  
  <pre><code>&lt;input type="text" 
         name="first_name" 
         id="first_name" 
         placeholder="First Name*" 
         pattern="[\w .-]" 
         required /&gt;
  </code></pre>
  
  <p>Example HTML Button (Not Submit type)</p>
  
  <pre><code>&lt;input type="button" 
         data-theme="z" 
         data-icon="forward" 
         data-inline="true" 
         name="form-submit-button" 
         id="form-submit-button" 
         value="Next Step"/&gt;
  </code></pre>