jQuery 조건부 큐 이벤트

Question

내가 갖고있는 것은 테이블 셀의 클릭 이벤트와 블러 이벤트에 각각 연결된 이벤트 핸들러 인 2 개의 함수 ("편집"및 "저장")입니다. 기본적으로 "편집"은 동일한 내용의 입력에 의해 셀의 내용을 바꾸고 반대의 작업을 수행합니다. 일부 아약스 호출로 DB를 업데이트합니다.

잘 작동합니다. 문제는 이제 2 개의 셀을 "연결"하여 첫 번째 셀의 값을 변경하면 두 번째 셀의 값에 따라 두 번째 셀의 값이 업데이트된다는 것입니다.

한 가지 경우를 제외하고는 거의 효과가 있습니다. 셀 # 1을 편집하고 값을 변경 한 다음 두 번째 셀을 클릭한다고 가정 해 봅니다. 블러 이벤트가 셀 # 1에서 트리거되어 "저장"함수를 호출하여 첫 ​​번째 셀을 새 값으로 정상 상태로 되돌리고 셀 # 2의 값을 변경합니다.

클릭 이벤트는 방금 클릭 한 셀 # 2에서 트리거되므로 "저장"이 완료되고 셀 # 2의 변경이 완료되기 전에 "편집"이 호출되어 처리를 시작합니다.

내가 원하는 것은 셀 # 2의 "편집"이 시작되기 전에 저장이 완료 될 때까지 대기하므로 올바른 값을 갖게된다는 것입니다.

JS 등에서 이벤트를 동기화하는 것에 대한 몇 가지 사항을 읽었지만 지금까지 문제를 성공적으로 적용하지 못했습니다.

아무도 도와 줄 수 있습니까?

감사

모든 '편집'조치를

Answer 1

, 당신은 아마 이전 '저장'행동이 하나가 완료되었는지 것을 의무화 전제 조건을 적용해야합니다. 예를 들어

:

$('...').click(function() { 

    // precondition 
    if(saveInProgress) return false; 

    // .. you code to switch to edit mode ... 

}); 

$('...').blur(function() { 

    // precondition 
    if(saveInProgress) return false; 

    // AJAX call for saving 
    doSave(); 

}); 

var saveInProgress = false; 
function doSave() { 

    saveInProgress = true; 
    $.ajax(..., 
     success: function() { 
      // ... your code ... 
      saveInProgress = false; 
     }, 
     error: function() { 
      // ... your code ... 
      saveInProgress = false; 
     } 
    ); 
}