2012-01-03 32 views
1

我有一個非常複雜的函數,它在提交表單時會執行幾個AJAX帖子來驗證值。根據從POST返回的值,提交應該工作或失敗。我認爲這可以使用全局布爾值來完成,並在整個函數中將其值設置爲true或false,然後在最後檢查布爾值是否已更改爲「true」,如果是,則調用「return false;」。在jQuery post回調的條件下返回false

雖然這是失敗的。我已經讀過它了,我認爲這是因爲AJAX調用是異步的,所以代碼不會按順序執行。

我的代碼是這樣的:

$('.to-step-3').click(function(){ 
var shape = ''; 
blnError = false; 
$.post('/base/RoomBuilder/GetRoomShape.aspx', function(data) { 
    if(data.substring(0,5) == 'Error'){ 
    alert(data); 
    blnError = true; 
    }else{ 
    shape = data; 

    $.post('/base/RoomBuilder/GetRoomDimensions.aspx', function(data2) { 
     if(data2.substring(0,5) == 'Error'){ 
     alert(data2); 
     blnError = true; 
     }else{ 
     var arrDims = data2.split('_'); 
     var l = arrDims[0]; 
     var w = arrDims[1]; 
     var sl = arrDims[2]; 
     var ll = arrDims[3]; 
     var sw = arrDims[4]; 
     var lw = arrDims[5]; 
     var failMessage = 'Please enter all required dimensions to build your room'; 

     switch(shape) { 
      case 'square': 
      if(!(notNullOrEmpty(l))){ 
       alert(failMessage); 
       blnError = true; 
      } 
      break; 
      case'rectangle': 
      if(!(notNullOrEmpty(l)) || !(notNullOrEmpty(w))){ 
       alert(failMessage); 
       blnError = true; 
      } 
      break; 
      case'lshaped': 
      if(!(notNullOrEmpty(sl)) || !(notNullOrEmpty(ll)) || !(notNullOrEmpty(sw)) || !(notNullOrEmpty(lw))){ 
       alert(failMessage); 
       blnError = true; 
      } 
      break; 
      case'lshapedalt': 
      if(!(notNullOrEmpty(sl)) || !(notNullOrEmpty(ll)) || !(notNullOrEmpty(sw)) || !(notNullOrEmpty(lw))){ 
       alert(failMessage); 
       blnError = true; 
      } 
      break; 
     } 
     } 
    }); 


    } 
}); 

if(blnError == true){ 
    return false; 
}else{ 
    return true; 
} 

}); 

我發現類似的東西jquery - return value from callback function (in post request) into the function its inside of?一個例子,但我在努力讓我的頭在它周圍的什麼,我需要做的情況下(我固然不是很大在Javascript!)

任何人都可以請指點我在這裏正確的方向,因爲我一直盯着這樣的方式太久了!謝謝大家。

回答

1

jQuery post本質上是異步的,所以在ajax響應來臨之前if條件已經被執行。如果你想讓執行等待直到ajax響應來,那麼你可以使用jQuery ajax設置async屬性爲false。試試這個

$.ajax({ 
    url: '/base/RoomBuilder/GetRoomDimensions.aspx', 
    async: false, 
    type: 'post', 
    success: function(){ 
     //Your logic here 
    } 
}); 

//Now check the condition here 
if(blnError == true){ 
    return false; 
}else{ 
    return true; 
} 
0

解決您的問題將只是使它同步調用最簡單的方法,

$.ajaxSetup({async: false}); 

$.post(..); 

$.ajaxSetup({async: true});