Выполнение команд последовательно в Javascript

Question

Буду признателен за любые предложения, чтобы решить эту проблему.

Я использую функцию JS checkAvailability (), чтобы подтвердить, доступна ли группа для добавления в базу данных. (По некоторым причинам ограничения базы данных не были применены) При этом иногда моя функция возвращается даже до получения вывода из файла PHP.

Так что я получаю смешанный результат. Когда получен вывод из файла PHP, он показывает правильный результат. Но в остальное время он просто возвращает ложь.

Есть какие-нибудь указатели на то, как это можно исправить? Код следует:

Спасибо, Вишь

// функция для проверки доступности имени группы

function checkAvailability(){
        var grpname = $('#groupname').val();
        var isAvailable = false 

        //use ajax to run the check
        $.post("checkGroupName.php", { gname: grpname },
            function(result){
                if(Number(result) == 0){
                    //show that the groupname is available
                    isAvailable = true ;
                    $('#username_availability_result').html(grpname + ' is Available');
                }
                else{
                    //show that the groupname is NOT available
                    isAvailable = false ;
                    $('#username_availability_result').html(grpname + ' is already taken');

                }
        });

    alert("isAvailable : "+isAvailable);
    return isAvailable ;
}  

checkGroupName.php file

$gname = $_POST['gname'];
$query = "SELECT * FROM groups WHERE group_name='$gname'";
$result = mysql_query($query);
if(mysql_num_rows($result)){        
    echo 1; 
else
    echo 0;

Answer 1

Ваша функция должна всегда возвращаться до завершения вашего ajax-запроса на страницу PHP, потому что ajax-запрос асинхронный .Вы запускаете в своей функции, но она завершается после выполнения сетевых операций..post не блокирует ожидание результата.

Вы можете заблокировать его, используя .ajax вместо .post с опцией async: false, но во многих браузерах, которые блокируют пользовательский интерфейс внеприятный способ во время сетевого запроса.

Вместо этого попросите вашу функцию принять обратный вызов, который она вызовет с результатом операции:

function checkAvailability(callback) {
    var grpname = $('#groupname').val();

    //use ajax to run the check
    $.post("checkGroupName.php", { gname: grpname },
        function(result){
            if(Number(result) == 0){
                //show that the groupname is available
                $('#username_availability_result').html(grpname + ' is Available');
                callback(true);
            }
            else{
                //show that the groupname is NOT available
                $('#username_availability_result').html(grpname + ' is already taken');
                callback(false);
            }
    });
}  

Код, который использовался для этого:

doSomething();
if (checkAvailability()) {
    itsAvailableLetsDoSomething();
    moreAvailableStuff();
}
else {
    itsNotAvailableDoSomethingElse();
    otherStuff();
}

... вместо этого выглядело бы так:

doSomething();
checkAvailability(function(available) {
    if (available) {
        itsAvailableLetsDoSomething();
        moreAvailableStuff();
    }
    else {
        itsNotAvailableDoSomethingElse();
        otherStuff();
    }
});

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

Answer 2

Вы можете попробовать этот код

функция checkAvailability () {

 var grpname = $('#groupname').val();
    var isAvailable = false 
    $.ajax({
        type: "POST",
        url: "checkGroupName.php",
        data: {grpname : grpname },
        success: function (result) { 
        if(Number(result) == 0){
                //show that the groupname is available
                isAvailable = true ;
                $('#username_availability_result').html(grpname + ' is Available');
            }
            else{
                //show that the groupname is NOT available
                isAvailable = false ;
                $('#username_availability_result').html(grpname + ' is already taken');

            }}
    });

}

Answer 3

проблема в том, что $.post отправляет запрос асинхронно и поэтому остальная часть кода выполняется до того, как ответ поступит с сервера.

решение состоит в том, чтобы использовать $. Ajax () и установить для параметра async значение false, чтобы вызов был синхронным.что-то вроде:

function checkAvailability(){
        var grpname = $('#groupname').val();
        var isAvailable = false 

        //use ajax to run the check
        $.ajax({
                type: 'post',
                url: 'checkGroupName.php',
                dataType: 'json',
                data:  { gname: grpname },
                async: false, 
                success: function(result){
                  if(Number(result) == 0){
                    //show that the groupname is available
                    isAvailable = true ;
                    $('#username_availability_result').html(grpname + ' is Available');
                }
                else{
                    //show that the groupname is NOT available
                    isAvailable = false ;
                    $('#username_availability_result').html(grpname + ' is already taken');

                }
        });

    alert("isAvailable : "+isAvailable);
    return isAvailable ;
}