jQuery的排序與自定義規則

Question

我有一個HTML表格有很多下面就類分級規則：「categorie」>「家庭」>「組」>「項目」

我想要實現jQuery的排序在這個表格部件（TBODY要準確）而是使用自定義的規則，我不明白，使工作：

• 「項」只在上面或下面的其他「項」
• 「組放「應該只放在一個」團體「之上或」家庭「之下
• 」家庭「守LD只能在另一個「家庭」的頂部或下方的「類別」
• 「類別」應該僅放置在另一個「類別」

頂端要排序元素時保持層次放。

換句話說，我正在尋找一個函數，告訴可以在拖動「是（否），你可以（不能）放在這裏」進行排序，因此顯示或不顯示佔位符。

Answer 1

我找到了解決辦法，也許不漂亮，但它的工作：

 var isValidPlacement = true; 
     $('#input-table tbody').sortable({ 
      placeholder: { 
       element: function (currentItem) { 
        return $('<tr id="placeholder"/>')[0]; 
       }, 
       update: function (container, p) { 
        return; 
       } 
      }, 
      change: function (event, ui) { 
       var placeholder = document.getElementById('placeholder'); 
       var currentLevel = $(placeholder).data('level'); 
       var prev = $(placeholder).prev(); 
       var next = $(placeholder).next(); 
       var prevLevel = prev ? prev.data('level') : 0; 
       var nextLevel = next ? next.data('level') : 0; 

       // If prevLevel > nextLevel 
       // then whe are at the end of a container 
       // so we can put an element of any level between those ones 
       // Else if prevLevel < newtLevel 
       // then we are just at the begging of a container 
       // so we can only put an element of level == prevLevel + 1 == nextLevel 
       // Finally if prevLevel == nextLevel 
       // then we are in the middle of a container 
       // so we can only put an element of level == prevLevel == nextLevel 
       isValidPlacement = (
          prevLevel > nextLevel 
         && prevLevel >= currentLevel 
         && currentLevel >= nextLevel 
         || 
          prevLevel <= nextLevel 
         && currentLevel === nextLevel); 

       placeholder.style.visibility = isValidPlacement ? "" : "hidden"; 
      }, 
      stop: function (event, ui) { 
       if (!isValidPlacement) { 
        $(this).sortable("cancel"); 
       } 
      } 
     }).disableSelection(); 

其中 '水平' 是hierarchi水平（這裏：類=> 1，家庭=> 2 ...）