XVal, JQuery Validate и Ajax, о мой!

Question

Я использую xVal с MVC и jquery validate. Все работает хорошо, пока я не доберусь до своего пользовательского валидатора, который выполняет вызов ajax.

вызов ajax возвращает правильное значение, в соответствии с вкладкой «Сеть». Но что-то идет не так, и я не могу понять это.

Вот код JavaScript:

    function CheckEmail() {
    var res;
    $.ajax({
        type: "GET",
        url: "/User/CheckEmail",
        data: "email=" + $('#EmailAddress').val(),
        success: function(result) {
            res = result;
        }
    });
    if (res == "True") {
        return true;
    }
    else {
        return false;
    }

}

когда я перехожу через firebug, res показывается как неопределенное. Я думаю, что это проблема.

Я потратил около 4 часов на реорганизацию и изменение этого кода, и, похоже, ничто не заставляет его работать должным образом.

У меня есть теория, что он не ждет, пока будет выполнен ajax для выполнения оператора if. Кто-нибудь может подтвердить или опровергнуть это?

Answer 1

Да, вы правы. $. Ajax () - это асинхронный вызов по умолчанию. Вы можете добавить async: false, чтобы сделать его синхронным.

$.ajax({
    type: "GET",
    async: false,
    url: "/User/CheckEmail",
    data: "email=" + $('#EmailAddress').val(),
    success: function(result) {
        res = result;
    }
});

Answer 2

«А» в Ajax обозначает асинхронный.

Что происходит, ваш код вызывается так:

$.ajax(...);
if (res == "True") {        
   return true;    
} else {        
   return false;    
}

Затем позже (как, спустя миллисекунды) возвращается запрос ajax и вызывает:

function(result) {
   res = result;        
}

Некоторые могут предложить сделать вызов Ajax асинхронным, но это предотвратит что-либо еще в браузере, пока запрос не вернется, что может быть плохо по многим причинам.

Лучшее решение - поместить логику проверки в обратный вызов, а не в функцию, которая создает и отправляет запрос Ajax.

Пример:

function CheckEmail() {    
    $.ajax({        
        type: "GET",        
        url: "/User/CheckEmail",        
        data: "email=" + $('#EmailAddress').val(),        
        success: function(result) {            
            if (result == "True") {
                doSomethingPositive();
            } else {
                warnUserInvalidEmail();
            }
        }    
    });    
}

Answer 3

Синхронный звонок на ваш веб-сервер не требуется. Вам следует избегать этого, насколько это возможно, потому что браузер пользователя будет заблокирован во время ожидания ответа.

Недавно я написал в блоге статью об удаленной проверке на стороне клиента (именно то, что вы пытаетесь достичь), показывающую, как это сделать с помощью асинхронного запроса.

Answer 4

Немного поздно, но все, что я могу сказать, это избегать проверки формы ajax - это создает ужасные ощущения для пользователя. Подумайте об этом так: если у вас есть 50 полей в форме и вы хотите интерактивной проверки, тогда ваш скрипт будет вызывать ваш сервер каждый раз, когда пользователь заполняет поле. Откройте Firebug и посмотрите, не шокируйте.