ajax 비동기방식을 동기방식으로 처리하기

가끔 우리가 하다보면 ajax로 처리될때 순차적으로 적용되어야 정상작동하는데
ajax가 비동기 방식이라서 서버의 속도에 따라 우리가 원하지 않는 결과를 초래한다.

$( "#selectable" ).selectable({
   filter : "a",
   selected: function(event, ui) {
      ui.selected.click();           
   }
});

selectable 함수는 마우스로 드래그시 여러개를 동시에 선택할 수 있는데
이때, 선택된 "a" 태그에 ajax가 비동기 방식으로 걸려있으면

ajax를 통해 내부 DB 접근시 본의 아니게 다른 결과 값을 가져올 때가 있다.

이때, ajax에 async: false 로 해주면 ajax가 동기방식이 되어 순차적으로 DB에 접근하여
우리가 원하는 결과를 가져오게 된다.

v_seat.click(function(event){
  
   ...
   $.ajxSeatSelect(v_seat_id,v_rsv_id,v_ply_id,$(this));
   event.preventDefault();
});

$.ajxSeatSelect = function(vSeat,vRsv,vPly,vThis){
 $.ajax({
  url : '/AjxAgent/ajxAdmSeatSelect.jsp',
  type : 'post',
  async: false,
  data : {seat_id:vSeat,rsv_id:vRsv,ply_id:vPly},
  dataType : 'json',
  success : function(data){
   // 통신 성공시 실행....
   $.each(data,function(){
    ...
   });

  },
  error : function(xhr,status,error){
   // 통신 실패시 실행....
   // alert(xhr.status + " " + xhr.statusText);
   // alert("통신실패 : ["+xhr.status + " " + xhr.statusText+"]");
   alert("데이터 불러오는데 실패했습니다.");

  },
  complete : function(data){
   // 통신 실패했어도 최종 완료시 실행...
  }

 });
}