How to check if email exists - php

Question

I'm trying to get an error that says that the email exists already and I'm trying to use jquery. I'm using ajax and it does work, because when I use firebug and I go to the console it says that the email address exists but I would like that to appear on the page.
index.php
<div class="register-newsletter">
<form id="myForm">
<input type="email" name="email" id="email" value="enter email address" required>
<input type="image" value="SUBMIT" id="sub" src="images/register.jpg">
</form>
<a class="newsletter" href="javascript:void(0);">Add to e-mailing list</a>
This is my jquery
$("#email").click(function(){
if($.trim($(this).val() ) == "enter email address"){
$(this).val("");
}
})
$("#email").blur(function(){
if($.trim($(this).val() ) == ""){
$(this).val("enter email address");
}
})
$("#sub").click(function () {
var email = $.trim($("#email").val());
if(email == "" || !isValidEmailAddress(email)){
alert('enter valid email');
return false;
}
var ajaxid = ajax("ajax/userInfo.php","email="+encodeURIComponent(email));
$("#result").html($.trim(ajaxid));
});
$("#myForm").submit(function () {
return false;
});
function clearInput() {
$("#myForm :input").val('');
}
$('p').hide();
$('#myForm').hide();
$(".newsletter").click(function(){
$(".newsletter").hide();
$('#myForm').show();
});
$('#myForm').submit(function(){
$('#myForm').hide();
$('p').show();
});
and this is my userInfo.php
<?php
include("../config.php");
global $_NEWSLETTER_CUSTOMERS_TABLE;
$email = $_POST['email'];
//$email = html_entity_decode(str_replace("'", "\'", $_POST["email"]));
$query = mysql_query("SELECT * FROM $_NEWSLETTER_CUSTOMERS_TABLE WHERE `email` = '".$email."'");
if(mysql_num_rows($query) >0){
echo '<span class="exists">Email address arleady exists</span>';
} else {
if(mysql_query("INSERT INTO $_NEWSLETTER_CUSTOMERS_TABLE(email) VALUES('$email')"))
echo "Successfully Inserted";
else
echo "Insertion Failed";
}

Answer 1

You are attempting to append the data incorrectly. jQuery's ajax() method takes a function that will be called upon the success of the request, called success. At the moment, you are trying to append ajaxid, (which contains ajax()s return value, not the result of the request) to #result.
var ajaxid = ajax("ajax/userInfo.php","email="+encodeURIComponent(email));
$("#result").html($.trim(ajaxid));
Should be more like:
var ajaxid = ajax("ajax/userInfo.php", {
data:"email="+encodeURIComponent(email),
success:function(d){
$("#result").html($.trim(d));
}
});

Answer 2

Use jQuery.post() inside your click handler:
$.post('ajax/userInfo.php', { email: email }, function(data) {
alert(data.message);
}, 'json');
And in your PHP file instead of echo use:
$response = array();
$response['message'] = mysql_query("...") ? 'success' : 'fail';
return json_encode($response);

Answer 3

You must return the value, eg JSON
Your JS
$("#sub").click(function () {
$.ajax({
url : "ajax/userInfo.php",
dataType : "json",
error : function(request, error) {
alert("Erreur : responseText: "+request.responseText);
},
success : function(data) {
alert(data.email_exist);
$("#result").html(data.email_exist);
}
});
});
AND your PHP
if(mysql_num_rows($query) >0){
$result = array(
'email_exist' => 'Email address arleady exists'
);
}
json_encode($result);