Проблема с AJAX, возвращаемым значением функции

Question

Я пытаюсь вернуть значение из ajax-запроса в функцию при отправке формы.

Код выглядит следующим образом:

function validateEmail(){ 
        if(email.val() == "")
        {
            $("#emailerror").html("Enter Email...");
            return false;
        }
        else {
        $.ajax({
            type: "POST",
            data: "email="+email.val(),
            url:'emailcheck.php',
            beforeSend: function(){
                $("#emailerror").html("Checking Email...");
            },
            success: function(data){
                if(data == "invalid")
                {
                    $("#emailerror").html("Invalid Email");
                    return false;
                }
                else if(data != "0")
                {
                    $("#emailerror").html("Email Already Exist");
                    return false;
                }
                else
                {
                    $("#emailerror").html("OK");
                    return true;
                }
            }
        });
        }
    }

При отправке формы я вызываю функцию и проверяю возвращаемое значение из ответа ajax:

$('#myForm').submit(function(){
        if(validateEmail())
        {
            alert('returning true');
            return true;
        }
        else
        {
            return false;
        }
});

Но,код не выполняется, когда возвращаемое значение равно true.Функция validateEmail () возвращает false.

Просьба помочь мне выяснить, где я ошибся ..

Заранее спасибо.

Answer 1

«A» в AJAX означает «асинхронный».

В else ветви validateEmail вы запускаете асинхронный запрос к emailcheck.php.validateEmail вернет до того, как ответит ваш PHP-файл;тогда ваш emailcheck.php скрипт ответит, jQuery вызовет ваш success обратный вызов, но никто не обратит внимания на то, что он возвращает.Результатом проверки формы является то, что ваш validateEmail выглядит следующим образом:

function validateEmail() { 
    if(email.val() == "") {
        $("#emailerror").html("Enter Email...");
        return false;
    }
    else {
        // Your $.ajax() might as well not even be here as
        // validateEmail will return before $.ajax() gets a
        // response from emailcheck.php
        return;
    }
}

Вы можете попробовать опцию async:false для $.ajax или переделать всеваша логика, чтобы иметь возможность ждать возврата асинхронного запроса.

Более того, вторая ветвь validateEmail не возвращает false, она вообще ничего не возвращает, но это все еще не такзначение.

Answer 2

Я считаю, что проблема в том, что вы получаете неопределенное значение в качестве возвращаемого значения от вашего вызова validateEmail (). Это потому, что ваш ajax-запрос выполняется асинхронно и функция validateEmail () завершается до того, как вы получите результат. Одним из решений (на мой взгляд, плохого) было бы установить для параметра async значение false в запросе ajax.

$.ajax({
        type: "POST",
        data: "email="+email.val(),
        url:'emailcheck.php',
        async: false,
        beforeSend: function(){
            $("#emailerror").html("Checking Email...");
        }

В противном случае я бы порекомендовал это. Независимо от того, что вы инициируете ваш вызов на отправку, вы можете вместо этого вызвать validateEmail (), а затем вызвать вызов оттуда.

validateEmail(); //Instead of trigger submit you call this function.    

function validateEmail(){ 
    if(email.val() == "")
    {
        $("#emailerror").html("Enter Email...");
        return false;
    }
    else {
    $.ajax({
        type: "POST",
        data: "email="+email.val(),
        url:'emailcheck.php',
        beforeSend: function(){
            $("#emailerror").html("Checking Email...");
        },
        success: function(data){
            if(data == "invalid")
            {
                $("#emailerror").html("Invalid Email");
                return false;
            }
            else if(data != "0")
            {
                $("#emailerror").html("Email Already Exist");
                return false;
            }
            else
            {
                $("#emailerror").html("OK");
                $('#myForm').submit(); //Here you trigger submit.
                return true;
            }
        }
    });
    }
}

Возможно, у вас есть другие функции проверки, но я думаю, что вы также сможете управлять этим.

Answer 3

if(data == "invalid")
            { // id data = invalid it good
                $("#emailerror").html("Invalid Email");
                return false;
            }
            else if(data != "0") //if data == good it work :) it is error
            {
                $("#emailerror").html("Email Already Exist");
                return false;
            }
            else
            {
                $("#emailerror").html("OK");
                return true;
            }

Может быть так:

if(data == "invalid")
            { // id data = invalid it good
                $("#emailerror").html("Invalid Email");
                return false;
            }
            else if(data == "good") //if data == good it work :) it is error
            {
                $("#emailerror").html("OK");
                return true;
            }
            else
            {
                $("#emailerror").html("Email Already Exist");
                return false;
            }