ajax code does not work on IE

[doforumda]

hi

i wrote a code for login. it uses xhtml, ajax and php. the problem is when i try to login using firefox and chrome it does log me in and working fine but when i check it on IE8 and safari it does not log me in. it just displays loader and does not process the code and does not log me in.

 

what am i doing wrong in this code. help please

 

$(document).ready(function () {
//This is function triggers when login button is clicked.
$('#loginbtn').click(function (){
	hideshow('loader',1);
	var url = "login.php";
	//var queryString = $("#login_form").serialize();
	var email = $('#email').val();
	var password = $('#password').val();
	var queryString = 'email=' + email + '&password=' + password;
	//alert(email);
	//alert(queryString);
	$.ajax({
		type: "POST",
		url: url,
		data: queryString,
		dataType: 'json',
		success: show_login
	});		
});

//This function triggers when loginbtn process is successfully completed.
function show_login(resultData) {
	//alert(resultData.error);
	if(resultData.error=='no') {
		$('.error').css('visibility','hidden');
		$('#login_form').submit();
		hideshow('loader',0);
	}
	else {
		hideshow('loader',0);
		$('.error').html(resultData.fieldErrors).css('visibility','visible');
	}
}
});

[JustLikeIcarus]

Here I changed this around a little bit see if it helps.  If IE is displaying the loader and nothing else then it most likely isnt recieving a response.  Sometimes this can be fixed by specifying the full path to the page you are calling via ajax instead of just login.php.  try out the changes I made and let me know if that helps at all.

 

$(document).ready(function () {

  //This is function triggers when login button is clicked.

  $('#loginbtn').click(function (){

      hideshow('loader',1);

      $.post('/login.php', { email: $('#email').val(), password: $('#password').val() }, function(data){

            show_login(data);

          }, 'json');

  });

});

 

//This function triggers when loginbtn process is successfully completed.

function show_login(resultData) {

      //alert(resultData.error);

      if(resultData.error=='no') {

        $('.error').css('visibility','hidden');

        $('#login_form').submit();

        hideshow('loader',0);

      }

      else {

        hideshow('loader',0);

        $('.error').html(resultData.fieldErrors).css('visibility','visible');

      }

}

[doforumda]

this also does not work. It also has the same problem.

To find out the problem i create a small login system. In the code below when i try to use dataType: 'html' then it does work on all browsers but when i change it to json then on firefox and chrome its fine but on IE8 and safari it is not working with the same problem.

here is the code

 

login_form.php

<form action="main.php" method="post" id="login_form">
Email:	<input type="text" name="email" id="email" /><br />
Password:    <input type="password" name="pass" id="pass" /><br />
    <input type="button" name="login" id="login" value="login">
</form>
<div id="msg"></div>
<script type="text/javascript" src="lib/jquery-1.4.min(Production).js"></script>
<script src="js/script.js" type="text/javascript"></script>

 

script.js

$(document).ready(function () {
$('#login').click(function () {
	var url = 'login.php';
	var queryString = $('#login_form').serialize();
	//alert(queryString);
	$.ajax({
		type: "POST",
		url: url,
		data: queryString,
		dataType: 'json',
		success: show_msg
	});
});

});

function show_msg(result) {
if(result.error=='no') {
	$('#login_form').submit();
}
else {
	$('#msg').html(result.error);
}
}

 

login.php

<?php
session_start();
$email = $_POST['email'];
$pass = $_POST['pass'];

//echo $email."<br>".$pass;
//die();
$error = 'yes';
if($email) {
$connect = mysql_connect('localhost','user','pass');
$db = mysql_select_db("db");
$password = md5($pass);
$check_email = mysql_query("SELECT * FROM users WHERE email='$email'");
$count_email = mysql_num_rows($check_email);
//echo $count_email;
if($count_email > 0) {
	while($row = mysql_fetch_assoc($check_email)) {
		$dbemail = $row['email'];
		$dbpassword = $row['password'];
	}
	if($email == $dbemail && $password == $dbpassword) {
		$_SESSION['email'] = $email;
		$error = 'no';
		$msg = "Welcome ".$_SESSION['email']."! You are now logged in.";
	}
	else
		$msg ="Wrong email or password.";
}
else
	$msg ="Email does not exist.";
}
else
$msg ="Enter email.";


$JSON_response = '{';
$JSON_response .= '"error": "'.addslashes($error).'",';
$JSON_response .= '"fieldErrors": "'.$msg.'",';
$JSON_response .= '}';
echo $JSON_response;


?>

[JustLikeIcarus]

Try replacing the following:

 

$JSON_response = '{';
$JSON_response .= '"error": "'.addslashes($error).'",';
$JSON_response .= '"fieldErrors": "'.$msg.'",';
$JSON_response .= '}';
echo $JSON_response;

With: (you may not need to set the header but you should.)

$JSON_array = array('error' => $error, 'fieldErrors' => $msg);
$JSON_response = json_encode($JSON_array);

header('Content-type: application/json');
echo $JSON_response;

[doforumda]

thanks JustLikeIcarus. it is working now.

please tell how can i use html dataType so when all the validation on php side passed and then the user is taken to the user admin area.

 

I am using json because i dont know how to achieve above

 

 

[JustLikeIcarus]

Well if you want it to return an Array you need to use the json type.  If you want html. One way is to return a Success or Fail message then in jQuery check to see if the returned html contains Success or Fail.  However a lot of systems make it to where data is only returned on fail otherwise the php redirects to the authenticated page.