title: Ajax Form Cannot Prevent Page Reload with event.preventDefault();
body: <p>I have the following code which is supposed submit a form via Ajax without having to reload the page:</p>
  
  <pre><code>$( document ).on('submit', '.login_form', function( event ){
      event.preventDefault();
      var $this = $(this);
      $.ajax({
          data: "action=login_submit&amp;" + $this.serialize(),
          type: "POST",
          url: _ajax_login_settings.ajaxurl,
          success: function( msg ){
  
              ajax_login_register_show_message( $this, msg );
  
          }
      });
  });
  </code></pre>
  
  <p>However for some reason, despite the <code>event.preventDefault();</code> function which is supposed to prevent the form from actually firing, it actually does fire. </p>
  
  <p>My question is, how do I prevent the above form from reloading the page?</p>
  
  <p>Thanks</p>