確認jQuery的排序接收事件

我有兩個獨立的無序列表：列表A和列表-B確認jQuery的排序接收事件

兩者都是排序感謝jQuery UI的插件。

我正在處理的項目的用戶希望確認將項目從一個列表移動到另一個列表時的操作，但在相同列表中移動時，要求而不是。當一個動作被觸發時，該頁面將啓動一個Ajax請求到服務器來更新列表的位置。

令人不安的是事件的順序。目前我的經驗是，更新事件在接收事件之前觸發，所以在顯示確認對話框之前，請求已經啓動。

不幸的是，我忘記了哪個列表觸發了請求，但在我的情況下它確實沒有關係：如果某個項目被拖動到另一個列表中，則在用戶確認該操作之前，不應將任何內容發送到服務器。

我已經使用jQuery相當多，但我想我可以在這個上使用一些幫助。

的Javascript：

$('.sortable').sortable({ 
    start: function (event, ui) { 
     $(ui.helper).addClass("sortable-drag-clone"); 
    }, 
    stop: function (event, ui) { 
     $(ui.helper).removeClass("sortable-drag-clone"); 
    }, 
    update: function (event, ui) { 

     if ($(ui.sender).length == 0) { 
      alert("item was moved within the same list."); 
      //Make request 
     } else { 
      //do nothing. 
     } 
    }, 
    receive: function (event, ui) { 
     if (confirm("show move or copy dialog, from {0} to {1}")) { 
      //do request 
     } else { 
      $(ui.sender).sortable("cancel"); 
      //no request 
     } 
    }, 
    tolerance: "pointer", 
    connectWith: ".sortable", 
    placeholder: "sortable-draggable-placeholder", 
    forcePlaceholderSize: true, 
    appendTo: 'body', 
    helper: 'clone', 
    zIndex: 666 
}).disableSelection();

標記：

<div id="list-A"> 
    <ul class="sortable"> 
     <li>item 1</li> 
     <li>item 2</li> 
     <li>item 3</li> 
    </ul> 
</div> 
<div id="list-B"> 
    <ul class="sortable"> 
     <li>item 1</li> 
     <li>item 2</li> 
     <li>item 3</li> 
    </ul> 
</div>

更新：

方案I） 用戶拖動A1至A3 - 結果是沒有確認對話框，以便一個請求被髮送給th e服務器，以便保持新的排序順序。

方案II） 用戶拖動A1至B3（B3或到A1） - 結果是確認對話框，然後，僅當該對話框被接受，一個請求被髮送到服務器。這是我在兩次請求中解決的地方，正如我在其中一條評論中所述。

來源

2011-01-26 Adam Asham

你不需要update方法然後，只是刪除它！ Example link。

來源

2011-01-26 09:29:40 ifaour

幾乎在那裏，但不完全。它不會在同一個列表中找到可排序的事件。但是，我確實通過設置數據屬性（「doConfirm」，true）並在停止事件處理程序中重置它來實現它。我會看看我能否找到代碼。它並不完美：它導致兩個請求被髮送到服務器（一個用於列表A，另一個用於列表B）。理想情況下，我希望自己彙總項目並啓動一個請求。 – 2011-01-29 12:36:13

確認jQuery的排序接收事件

回答

相關問題