Why ajax doesn't work unless I refresh or use location.href?
- by Connor Tang
I am working on a html project, which will eventually package by Phonegap. So I am trying to encode the data from html form to JSON format, then use ajax send to a php file resides on server, and receive the response to do something else.
Now I use <a href='login.html'> in my index.html to open the login page. In my login page, I have this
<script>
$(document).ready(function(e) {
$('#loginform').submit(function(){
var jData = { "email": $('#emailLogin').val(), "password": $('#Password').val()};
$.ajax({
url: 'PHP/login.php',
type:'POST',
data: jData,
dataType: 'json',
async: false,
error: function(xhr,status){
//reload();
location.href='index.html';
alert('Wrong email and password');
},
success: function(data){
if(data[1] == 1){
var Id_user = data[0];
location.href='loginSuccess.html';
}
}
});
});
});
</script>
to send my data to server. But I found that it won't work, it's still in the login page. I tried to enter data and submit again, it's still nothing happen. Until I refresh the login page and enter data again, it can give an error message or go to the loginsuccess page. However, when I use <script>
function loadLogin(){
location.href='login.html';
} </script> to open the login page, everything works well.
So what cause this? How can I modify this piece of code to make it better?
