jqueryui portlets在列排序

我正在使用jQuery UI sortable portlets。 jQueryUI的排序頁面指的是你有附加的事件處理程序，如果門戶被從一列移動到其他文件時，收到函數需要的東西護理，如下圖所示：jqueryui portlets在列排序

$(".column").sortable({ 
     connectWith: ".column", 
     placeholder: 'ui-state-highlight', 
     handle: 'h6', 
     revert: true, 
     receive: function(event, ui) { 
     console.log(ui.item); 
     }, 
     over: function(event, ui){ 
      console.log(ui.item); 
     }

的over功能如上所述，我認爲會記錄元素是否在同一列上移/下移。但是這並沒有發生。

那麼，當一個portlet在同一列內向上/向下移動時，如何獲取事件。

一個簡單的小提琴是located here。

來源

2012-07-07 user993563

你似乎在尋找change事件，當一個排序元素的位置被更新時被觸發，即使在同一列：

$(".column").sortable({ 
    connectWith: ".column", 
    placeholder: "ui-state-highlight", 
    handle: "h6", 
    revert: true, 
    receive: function(event, ui) { 
     console.log(ui.item); 
    }, 
    change: function(event, ui) { 
     console.log(ui.item); 
    } 
});

你會發現一個更新的小提琴here。

來源

2012-07-10 09:39:22

sort事件似乎相當於over事件，但在一列內。 sort和change之間的差異在於，當您移動鼠標並且元素落入其位置之後，您移動元素時觸發sort，觸發change。

sort : function (event, ui) { 
    console.log(ui.item); 
}

這些事件在jQuery UI pages上有詳細記錄。仔細查看每個人是否最適合您的需求。

來源

2012-07-10 09:51:30

您實際上不必釋放鼠標按鈕來觸發'change'事件，只是爲了移動足夠的元素才能重新排序它的兄弟節點。另一方面，在我的測試中，只要一個元素被移動，就會觸發'sort'，即使它保持相同的位置（所以它會發生很多*）。 – 2012-07-10 09:58:03

是的，你是對的。我誤解了。 – 2012-07-10 10:22:59

更改功能將會訣竅。

$(".selector").sortable({ 
    change: function(event, ui) { ... } 
}); 
Bind to the change event by type: sortchange. 
$(".selector").bind("sortchange", function(event, ui) { 
    ... 
});

來源

2012-07-13 16:50:20 apcelent

我forked您的片段與您的要求的工作它僅使用爲目的的更改事件。

這裏的訣竅是跟蹤portlet的列之前和之後的變化。（通過hasColumnChange功能完成）

使用更改事件的缺點是它似乎兩次啓動，我不知道爲什麼，但它應該滿足您。

來源

2012-07-15 10:12:59

jqueryui portlets在列排序

回答

相關問題