拖放 - 从表到UL / LI

Question

此刻我被困住了。我想将表格行拖放到li元素。

内容或dom元素不应自动移动＆＃34;那里。我只需要一个事件，我可以获取移动的元素和目标，它被删除的位置。

我根据另一个问题创造了一个小提琴。我希望有人可以提供协助。

＆＃13;

＆＃13;

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script type="text/javascript">
 jQuery(function($) {
   $('#list2 tr.document').draggable({
     cursor: 'move',
     helper: 'clone',
     connectToSortable: "#list1",
   });
   $('#list1').sortable({
     revert: true,
   });
 });
</script>

folders
<ul id='list1'>
  <li class="folderentry">Some
    <ul>
      <li class="folderentry">2nd level</li>
    </ul>
  </li>
  <li>Thing</li>
</ul>

table items
<table id='list2'>
  <tbody id="documents">
    <tr class="document">
      <td>row 1</td>
    </tr>
    <tr class="document">
      <td>row 2</td>
    </tr>
    <tr class="document">
      <td>row 3</td>
    </tr>
    <tr class="document">
      <td>row 4</td>
    </tr>
  </tbody>
</table>

＆＃13;

＆＃13;

＆＃13;

提前致谢。

PS：我正在使用jquery / bootstrap。包括jquery-ui也不是问题。