禁用jQueryUI在某個區域中丟棄可排序項目

Question

我有一個看板樣式使用jQueryUI可拖放板子排序。

每列是板和板上的每個可拖動Div是卡。

甲局可以具有小孩子板該基團在1 母基板一組相關的板。

我遇到了拖放卡到新板的問題。問題是，當卡被拖到具有子板的電路板上時，卡在進入子板表之前過早掉落。

它導致卡被丟棄在主板<td>表格單元內，但在進入子板<table>之前，這是在主板<td>內。

此圖像應有助於解釋更好一點......

紅色框顯示爲2局我有兒童板的HTML。
<td>上方和下方的表格單元格是沒有子板的常規單元格。一張卡片可以放入那些<td>單元格中。

在有子板的母板上。你可以看到他們有<table>裏面有<td>。

的問題是，當卡被拖到具有子護板一板和卡降至很快，因此導致卡<td>和子板<table> ....

之間的

http://i.stack.imgur.com/mUPHz.png

---

這裏是顯示在一個「不確定」區域母基板和子板之間下降的卡的例子......我需要以某種方式使之不可能會在此區域丟棄一張卡片！

http://i.imgur.com/9N6tkbj.png

---

圖像顯示什麼是董事會和卡和子板VS家長沒有子板

---

示例顯示一張卡片被拖入不良位置，以及它如何將子板卡片移開，並允許父母與子女之間掉線。我需要防止這種情況發生？

---

或許有辦法阻止jQueryUI的可排序從允許跌落如果<td>與CSS類column ui-sortable有<table>裏面它？

---

這裏是一個快速的jsfiddle顯示問題http://jsfiddle.net/jasondavis/j37131oo/3/

Answer 1

一個解決辦法是增加與孩子一板對class這些td並設置sortable只有那些沒有這個類。喜歡的東西：

$('.columns > table').parent().addClass('hasChildBoard'); 

然後：

$(".column:not(.hasChildBoard)").sortable({ 
     connectWith: ".column", 
    }); 

http://jsfiddle.net/yuw2opzr/