Перетаскивание нескольких строк из таблицы html с использованием JQuery с <thead> тегами

Question

У меня есть две таблицы в JsFiddle, и я хочу поменять строки <tr> между ними. Я хочу иметь возможность сделать это с Jquery, однако прямо сейчас, из-за тега <thead>, он не работает. Я думаю, что это имеет какое-то отношение к items в selector, но я не знаю, как его изменить, чтобы он игнорировал <thead>. Мне было интересно, как изменить код так, что он может сделать все, перетаскивать и повторно организовать, возможность кроме <thead> тегов

JsFiddle

в текущем jsfiddle, удаляя <thead> теги будут работать, однако я нужен <thead> будет

Answer 1

Пожалуйста, исправьте свой HTML-код. Вы должны положить тег «thead» из «tbody» Он будет работать. Еще одна вещь, вам не нужно использовать droppable с сортировкой, удалите ее. Рабочая версия: http://jsfiddle.net/73kv2vm9/1/

  <table id='table-draggable1'> 
      <thead> 
       <tr> 
        <th>col1</th> 
        <th>col2</th> 
        <th>col3</th> 
        <th>col4</th> 
       </tr> 
       </thead> 
      <tbody class="connectedSortable"> 
       <tr> 
        <td>156</td>                       
        <td>668</td>                
        <td>100.95</td> 
        <td>1.82</td>                 
       </tr> 
       <tr> 
        <td>256</td>                       
        <td>668</td>                
        <td>100.95</td> 
        <td>1.82</td>                 
       </tr> 
      </tbody> 
     </table> 
     <table id='table-draggable2'> 
      <thead> 
       <tr> 
        <th>COL1</th> 
        <th>COL2</th> 
        <th>COL3</th> 
        <th>COL4</th> 
       </tr> 
       </thead> 
      <tbody class="connectedSortable"> 
       <tr> 
        <td>356</td>                       
        <td>668</td>                
        <td>100.95</td> 
        <td>1.82</td>                 
       </tr> 
       <tr> 
        <td>456</td>                       
        <td>668</td>                
        <td>100.95</td> 
        <td>1.82</td>                 
       </tr> 
      </tbody> 
     </table>