James Nixon
James Nixon

Reputation: 327

How do I throw an error message within AJAX?

For some reason I can't throw an error message to say whether or not an email exists inside of my user table. I understand that because AJAX is async I can't use try and catch error messages inside the complete function. But I tried splitting it into functions and it still doesn't work.

Try, Catch Function (I do call this else where in my code)

try {

    // Check fields are not empty
    if (!firstName || !lastName || !aquinasEmail || !sPassword || !sCPassword || !Gender) {
        throw "One or more field(s) have been left empty.";
    }

    // Check the email format is '@aquinas.ac.uk'
    if(!emailCheck.test(aquinasEmail)) {
        throw "The email address you entered has an incorrect email prefix. ";
    }

    // Check there are not any numbers in the First or Last name
    if (!regx.test(firstName) || !regx.test(lastName)) {
        throw "First Name or Last Name is invalid.";
    }

    // Check the confirmation password is the same as the first password
    if (sPassword != sCPassword) {
        throw "The two passwords you've entered are different.";
    }

    if(duplicatedEmail()) {
        throw "Sadly, your desired email is taken. If you have forgotten your password please, <a href=\"#\">Click Here</a>";
    }



} catch(err) {
    if (!error) {
        $('body').prepend("<div class=\"error alert\">"+err+"</div>");
        $('.signupInput.sPassword').val('');
        $('.signupInput.sCPassword').val('');
        setTimeout(function() {
            $('.error.alert').fadeOut('1000', function() {$('.error.alert').remove();});
        }, 2600);
    }

    event.preventDefault();
}

AJAX Function:

function duplicatedEmail() {
// Use AJAX function to do verification checks which can not be done via jQuery.
        $.ajax({
            type: "POST",
            url: "/login/ajaxfunc/verifyReg.php",
            dataType: "JSON",
            async: false,
            data: $('.signupForm').serialize(),
            success: function(data) {
                    if (data.emailTaken == true) {
                        return true;
                    } else {
                        return false;
                    }
            }
        });
}

verifyReg.php

<?php
    header('Content-Type: application/json', true);
    $error = array();
    require_once '../global.php';

    $_POST['aquinas-email'] = "[email protected]";

    // Check if an email already exists.
    $checkEmails = $db->query("SELECT * FROM users WHERE aquinasEmail = '{$_POST['aquinas-email']}'");
    if ($db->num($checkEmails) > 0) {
        $error['emailTaken'] = true;
    } else {
        $error['emailTaken'] = false;
    }

    echo json_encode($error);
?>

Upvotes: 1

Views: 11251

Answers (3)

aitnasser
aitnasser

Reputation: 1256

to handle the error with jquery ajax function add error callback like this

           function duplicatedEmail() {
            // Use AJAX function to do verification checks which can not be done via jQuery.
                    $.ajax({
                        type: "POST",
                        url: "/login/ajaxfunc/verifyReg.php",
                        dataType: "JSON",
                        async: false,
                        data: $('.signupForm').serialize(),
                        success: function(data) {
                                if (data.emailTaken == true) {
                                    return true;
                                } else {
                                    return false;
                                }
                        },  
                       error: function() {
                             //Your Error Message   
                     console.log("error received from server");       
                               }  
                    });
            }

to throw an exception in your PHP:

           throw new Exception("Something bad happened");

Upvotes: 0

use ajax error function..

function duplicatedEmail() {
// Use AJAX function to do verification checks which can not be done via jQuery.
    $.ajax({
        type: "POST",
        url: "/login/ajaxfunc/verifyReg.php",
        dataType: "JSON",
        async: false,
        data: $('.signupForm').serialize(),
        success: function(data) {
                if (data.emailTaken == true) {
                    return true;
                } else {
                    return false;
                }
        },
        error: function (result) {
            alert("Error with AJAX callback"); //your message
        }
    });
}

Upvotes: -1

BenG
BenG

Reputation: 15164

Looking at your AJAX Function, and these two answers here and here, you need to make a small change to how you are returning the synchronous result:-

function duplicatedEmail() {

    var result;

    $.ajax({
        type: "POST",
        url: "/login/ajaxfunc/verifyReg.php",
        dataType: "JSON",
        async: false,
        data: $('.signupForm').serialize(),
        success: function(data) {
                result = data.emailTaken;
        }
    });

    return result;
}

Upvotes: -1

Related Questions