Jquery on submit ajax post needs two clicks in IE

106 views Asked by At

I cannot explain the following:

I have the following code. This code works fine in Firefox and Chrome, but in IE, users have to press the submit button twice to login.

file example1.js

$(document).ready(function(){

$('body').on("submit", "#signinForm", function( event ) {
    event.preventDefault(); 
    target = (event.currentTarget) ? event.currentTarget : event.srcElement;
    bp_ajax(callback_login_succes, target);
});

var callback_login_succes = function(data, textStatus, xhr) {

    $(jQuery.parseJSON(JSON.stringify(data))).each(function() {  
        if (this.code !== 'success') {
            // give the response to a validate function         
            bp_validate(data);
        } else {
            // success so redirect
            setTimeout("document.location.href='/"+lang+"/index/';",0); 
        }
    });

}
});

In a seperate js file I have:

var bp_ajax = function(cb, form) {
$.ajax({
    type: 'post',
    url: '/ajax/validation.php',
    data: $(form).serialize(),
    success: cb
});
}

HTML

<form id="signinForm" action="#" role="form" autocomplete="off" method="post" enctype="application/x-www-form-urlencoded">
    <input name="login_usernameemail" id="login_usernameemail" class="form-control" placeholder="Username">
    <input type="password" name="login_pass" id="login_pass" class="form-control" placeholder="Password">
    <button id="btnSignin" type="submit" class="btn btn-primary">Login</button>
</form>
2

There are 2 answers

1
pherris On

Not sure exactly why this is happening, but a few suggestions may help clean it up

  1. listen to click on #btnSignin instead of submit
  2. replace type="submit" on your button with type="button" (won't try to submit the form, so you don't have to cancel the event)
  3. remove event.preventDefault() from your event click handler.

This way you are not writing a button that submits a form, then coding to make it not do that - you are just writing a button that fires an event when it's clicked.

0
timboektoe On

Did you try adding: contentType:"application/json; charset=utf-8"