How does Ajax work with PHP?

Question

I'm having troubles using ajax and php. What I'm trying to do is call an ajax function that grabs a value from an form's input, and checks if that email exists in a database. Here is my current javascript:

//Checks for Existing Email
function checkExisting_email() {
    $.ajax({
        type: 'POST',
        url: 'checkExist.php',
        data: input
    });

emailExists = checkExisting_email();

//If it exists
if (emailExists) {
    alert("This email already exists!");
}

Unfortunately, I can't get my alert to go off. In my PHP function, it checks whether the input is a username or an email (just for my purposes, and so you know), and then it looks for it in either column. If it finds it, it returns true, and if not, it returns false:

include ('func_lib.php');
connect();
check($_POST['input']);

function check($args)
{
    $checkemail = "/^[a-z0-9]+([_\\.-][a-z0-9]+)*@([a-z0-9]+([\.-][a-z0-9]+)*)+\\.[a-z]{2,}$/i";
    if (!preg_match($checkemail, $args)) {
        //logic for username argument
        $sql = "SELECT * FROM `users` WHERE `username`='" . $args . "'";
        $res = mysql_query($sql) or die(mysql_error());

        if (mysql_num_rows($res) > 0) {
            return true;
        } else {
            return false;
        }
    } else {
        //logic for email argument
        $sql = "SELECT * FROM `users` WHERE `email`='" . $args . "'";
        $res = mysql_query($sql) or die(mysql_error());

        if (mysql_num_rows($res) > 0) {
            return true;
        } else {
            return false;
        }
    }

}

SO my issue is, how does ajax respond to these returns, and how do I make ajax function accordingly? Mainly, why doesn't this work?

Any help is very much appreciated. Thank you!

Answer 1

Basically ajax is a hand-shaking routine with your server.

Ajax:

$.post('yoursite.com/pagewithfunction.php',
    {postkey1:postvalue1, postkey2:postvalue2...},
    function (response) {
       // response is the data echo'd by your server
    }, 'json'
);

pagewithfunction:

yourFunction(){
   $var1 = $_POST['postkey1'];....
   $result = dosomething($var1..);
   echo json_encode($result); // this is passed into your function(response) of ajax call
}

So in $.post you have the url of the php page with the function, { var:val } is the post data, and function(response) is where you handle the data that is echo'd from your server -- the variable, response, is the content that is echo'd.

Answer 2

You need to add the success option to your Ajax request, which is the JS function which gets executed when the XHR succeeds. Have a look at the jQuery documentation for more info.

Without running the script, I think you'll find that $_POST['input'] is empty; you need to pass your data as something like data: {'input': input} to do that.

Your PHP also needs to return some content to the script; consider changing your call to check() to something like this:

echo (check($_POST) ? 'true' : 'false');

You can now check the content in JavaScript.