자바 스크립트에서 순차적으로 명령을 실행

Question

나는이 문제를 해결할 수있는 제안을 주시면 감사하겠습니다.

DB에 checkAvailability() 함수를 사용하여 그룹을 데이터베이스에 추가 할 수 있는지 확인합니다. (어떤 이유로 데이터베이스 키 제약 조건이 적용되지 않았습니다.) 이 작업을 수행하는 동안 PHP 함수에서 출력을 받기 전에도 함수가 반환되는 경우가 있습니다.

그래서 나는 혼합 결과를 얻습니다. PHP 파일의 출력을 받으면 올바른 결과를 보여줍니다. 그러나 단지 거짓을 반환하는 시대의 나머지.

어떻게 고칠 수 있습니까? 코드는 다음과 같습니다 문제가 $.post 보내는 것입니다

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이

$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

파일

감사합니다, Vish

// 기능은 그룹 이름의 사용 가능 여부를 확인하기 위해 요청은 비동기 적으로 나머지 대구는 e는 응답이 서버에서 도착하기 전에 실행됩니다.

해결 방법은 $.ajax()을 사용하고 비동기 옵션을 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 ; 
} 

Answer 2

함수해야 아약스 요청이 비동기 때문에 항상에서, PHP 페이지 완료로 Ajax 요청하기 전에 반환 될 수있다. 은 사용자 기능에서으로 시작하지만 네트워크 작업이 완료되면 완료됩니다. .post은 결과 대기를 차단하지 않습니다.

당신은이 async: false 옵션을 .ajax보다는 .post를 사용하여 차단 할 수 있지만, 많은 브라우저에서 해당 네트워크 요청 중에 불쾌한 방식으로 UI를 잠급니다.

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

... 대신 보일 것이다

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(); 
checkAvailability(function(available) { 
    if (available) { 
     itsAvailableLetsDoSomething(); 
     moreAvailableStuff(); 
    } 
    else { 
     itsNotAvailableDoSomethingElse(); 
     otherStuff(); 
    } 
}); 

위에서 볼 수 있듯이, 영향은 미미하지만, 이렇게하면 비동기 통신의 장점으로 사용자의 UI를 응답 성있게 유지합니다.

Answer 3

당신이 코드를

기능 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'); 

      }} 
    }); 

}