javascript - 固定列を使用してツリーテーブルをデータテーブルに結合する方法

Question

こんにちは、展開と折りたたみ時に固定列を使用してツリーテーブルをデータテーブルに結合することに関する問題に直面しています。

これが私が試した私のコードです。問題を解決するために私を助けてください。

$("#example").treetable({expandable:true});
$('#example').DataTable( {
        scrollX:        true,
        fixedColumns:   true,
          "scrollX": true,
	} );

<link href="http://ludo.cubicphuse.nl/jquery-treetable/css/jquery.treetable.css" rel="stylesheet" />
<link href="http://ludo.cubicphuse.nl/jquery-treetable/css/jquery.treetable.theme.default.css" rel="stylesheet" />
<link href="http://cdn.datatables.net/1.9.4/css/jquery.dataTables.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/fixedcolumns/3.1.0/js/dataTables.fixedColumns.min.js"></script>
<script src="http://ludo.cubicphuse.nl/jquery-treetable/jquery.treetable.js"></script>
<table id="example" class="display nowrap" cellspacing="0" width="100%">
   <thead>
      <tr>
         <th rowspan="2">Level</th>
         <th colspan="4">Main Header 1</th>
         <th colspan="3">Main Header 2</th>
         <th colspan="4">Main Header 3</th>
      </tr>
      <tr>
         <th>Sub Header 11</th>
         <th>Sub Header 12</th>
         <th>Sub Header 13</th>
         <th>Sub Header 14</th>
         <th>Sub Header 21</th>
         <th>Sub Header 22</th>
         <th>Sub Header 23</th>
         <th>Sub Header 31</th>
         <th>Sub Header 32</th>
         <th>Sub Header 33</th>
         <th>Sub Header 34</th>

      </tr>
   </thead>

   <tbody>
      <tr data-tt-id='1'>
         <td>Place 1</td>
         <td>Data1</td>
         <td>Data2</td>
         <td>Data3</td>
         <td>Data4</td>
         <td>Data5</td>
         <td>Data6</td>
         <td>Data7</td>
         <td>Data8</td>
         <td>Data9</td>
         <td>Data10</td>
         <td>Data11</td>
      </tr>
      <tr data-tt-id='1-1' data-tt-parent-id='1'>
         <td>Child 1</td>
         <td>Data1</td>
         <td>Data2</td>
         <td>Data3</td>
         <td>Data4</td>
         <td>Data5</td>
         <td>Data6</td>
         <td>Data7</td>
         <td>Data8</td>
         <td>Data9</td>
         <td>Data10</td>
         <td>Data11</td>
      </tr>
      <tr data-tt-id='1-1-1' data-tt-parent-id='1-1'>
         <td>Sub-Child 2</td>
         <td>Data1</td>
         <td>Data2</td>
         <td>Data3</td>
         <td>Data4</td>
         <td>Data5</td>
         <td>Data6</td>
         <td>Data7</td>
         <td>Data8</td>
         <td>Data9</td>
         <td>Data10</td>
         <td>Data11</td>
      </tr>
      <tr data-tt-id='1-2' data-tt-parent-id='1'>
         <td>Child 2</td>
         <td>Data1</td>
         <td>Data2</td>
         <td>Data3</td>
         <td>Data4</td>
         <td>Data5</td>
         <td>Data6</td>
         <td>Data7</td>
         <td>Data8</td>
         <td>Data9</td>
         <td>Data10</td>
         <td>Data11</td>
      </tr>
      <tr data-tt-id='2'>
         <td>Place 2</td>
         <td>Data1</td>
         <td>Data2</td>
         <td>Data3</td>
         <td>Data4</td>
         <td>Data5</td>
         <td>Data6</td>
         <td>Data7</td>
         <td>Data8</td>
         <td>Data9</td>
         <td>Data10</td>
         <td>Data11</td>
      </tr>
   </tbody>
</table>