내가 방울을 떨어 뜨린 직후에 500ms 동안 끌기를 사용하지 못하게하려고합니다.

Question

목록을 재정렬하면 항목을 삭제하자마자 내 백엔드 코드에 위치가 제출되고 백엔드에서 목록의 순서가 변경됩니다. 그러나, 나는 정말로 빨리 재주문을하면 프론트 엔드와 백엔드의리스트가 잠시 후에 더 이상 동기화되지 않는다는 사실을 알게되었다. 따라서 경쟁 조건을 피하기 위해 짧은 순간 동안 드래그 한 후에 드래그를 즉시 해제하고 싶습니다. 당신이 볼 수 있듯이

function reorder(panelId, type){ 
    $(escapeClientId(panelId)).sortable({ 
     start: function(event, ui){ 
      ui.item.startPos = ui.item.index(); 
     }, 
     stop: function(event, ui){ 
      //submit my start and end position to the server 
      //change the cursor to wait 
      $('body').css('cursor', 'wait'); 
      window.setTimeout(wait,600);          
     } 
    }); 
    $(escapeClientId(panelId)).disableSelection(); 
} 
function wait(){ 
    $('body').css('cursor', 'default'); 
} 

, 나는 커서가 대기 모드에있는 경우에도 그러나, 여전히 사용자가 순서를 드래그 할 수 있도록, 600ms의에 대한 wait 커서 커서를 변경합니다. 내가 떨어 뜨린 직후 잠시 동안 드래그를 완전히 비활성화하는 방법이 있습니까?

Answer 1

당신에게 disable 및 enable 방법을 사용하여 시도 할 수 있습니다 :

function reorder(panelId, type) { 
    $(escapeClientId(panelId)).sortable({ 
     start: function (event, ui) { 
      ui.item.startPos = ui.item.index(); 
     }, 
     stop: function (event, ui) { 
      var panel = $(this), 
       body = $('body'); 

      panel.sortable("disable"); // Disable before submitting. 
      body.css('cursor', 'wait'); 

      //submit my start and end position to the server 
      //change the cursor to wait 

      setTimeout(function() { 
       body.css('cursor', 'default'); 
       panel.sortable("enable"); 
      }, 500); // Enable after 500 ms. 
     } 
    }); 
    $(escapeClientId(panelId)).disableSelection(); 
}