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 ...）