javascript - jQuery DataTables - Sorting doesn't work when column is clicked -

the tabs/search bar/page entries appear @ top of table expected. not sorted when clicked. it's looks @ first row.

<script>      $(document).ready( function () {      $('#aeotable').datatable();      } );  </script>  echo '      <table id="aeotable" class="display">             <thead>                      <tr>                     <th>company name</th>                     <th>expiry insurance certificate</th>                     <th>comments</th>                     <th>file name</th>                     <th>&nbsp;</th>                 </tr>             </thead>';        // print each file     while($row = $result->fetch_assoc()) {         echo "         <tbody>             <tr>                 <td>{$row['cop']}</td>                 <td>{$row['expo']}</td>                 <td>{$row['dec']}</td>                 <td>{$row['fil']}</td>                 <td><a download href=\"file/{$row['file']}\">download</a></td>               </tr>         </tbody>";     }      // close tabl     echo '</table>'; 

you creating <tbody> each row instead of 1 <tbody> rows.

change

echo '<tbody>'; // print each file while($row = $result->fetch_assoc()) {     echo "                 <tr>             <td>{$row['cop']}</td>             <td>{$row['expo']}</td>             <td>{$row['dec']}</td>             <td>{$row['fil']}</td>             <td><a download href=\"file/{$row['file']}\">download</a></td>         </tr>"; }   echo ' </tbody>';