Datatables console error jQuery.Deferred exception: Cannot set property '_DT_CellIndex'

<div>Hallo, izin menjawab, sepertinya looping agan, membuat struktur tabelnya jadi tidak beraturan.<br>Untuk membuat tabel dengan terstruktur harusnya sepert ini :<br><br></div><pre>&lt;table border = "1" width = "100%"&gt; &lt;!-- Mendefinisikan header table --&gt; &lt;thead&gt; &lt;tr&gt; &lt;td colspan = "4"&gt;This is the head of the table&lt;/td&gt; &lt;/tr&gt; &lt;/thead&gt;

<!-- Mendefinisikan body table -->
<tbody>
	<tr>
		<td>Cell 1</td>
		<td>Cell 2</td>
		<td>Cell 3</td>
		<td>Cell 4</td>
	</tr>
</tbody>
<!-- Mendefinisikan footer pada table -->
<tfoot>
	<tr>
		<td colspan = "4">This is the foot of the table</td>
	</tr>
</tfoot>

&lt;/table&gt;</pre><div><br>plugin Datatable, mengharuskan struktur tabel kita seperti diatas, sedangkan dari script agan, agan melakukan looping pada tag &lt;tbody&gt; sehingga tag tersebut akan berulang beberapa kali. Solusinya, lakukan looping (while) di&nbsp; dalam &lt;tbody&gt;, jadi yang di loop itu tag &lt;tr&gt; -nya, kodenya seperti ini :<br><br></div><pre>&lt;?php include("config.php"); ?&gt;

&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;

<em>&lt;!-- bootstrap css --&gt;</em> &lt;link rel="stylesheet" href="css/bootstrap.min.css"&gt; &lt;link rel="stylesheet" href="css/style.css"&gt;

<em>&lt;!-- icons --&gt;</em> &lt;link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png"&gt; &lt;link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png"&gt; &lt;link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png"&gt; &lt;link rel="manifest" href="icons/site.webmanifest"&gt; &lt;link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#5bbad5"&gt; &lt;meta name="msapplication-TileColor" content="#da532c"&gt; &lt;meta name="theme-color" content="#ffffff"&gt; &lt;script src="https://code.jquery.com/jquery-3.1.0.js"&gt;&lt;/script&gt; &lt;script src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;

&lt;title&gt;INKA&lt;/title&gt; &lt;/head&gt; &lt;body &gt; <em>&lt;!-- php func --&gt;</em> &lt;?php session_start();

  if($_SESSION['id']=='$id'){
    header("location:index.php?pesan=gagal");
  }
?>
<em><!--  --></em>

<em><!-- jumbo tron  --></em>
<div class="jumbotron jumbotron-fluid ">
  <em><!-- container --></em>
  <div class="container mt-n4" style="height:500px">
    <em><!-- flexbox --></em>
    <div class=" d-flex flex-row-reverse mb-3 ml-5">
    <a href="logout.php" type="button" class="btn btn-danger mb-5" id="keluar" name="keluar ">keluar</a>
    </div>
    <em><!--flexbox end --></em>

    <em><!-- card --></em>
    <div class="card text-nowrap">
      <div class="card-header text-center strong">
      <em><!-- tampil nama --></em>
      <?php
      $query = "SELECT * FROM user 
                where id= $_SESSION[id]";

      $query = "SELECT id,nama 
                FROM user
                where user.id= $_SESSION[id]";

      $result = mysqli_query($koneksi, $query);

      if(!$result){
        die ("Query Error: ".mysqli_errno($koneksi).
        " - ".mysqli_error($koneksi));
      }
      while($data = mysqli_fetch_assoc($result))
      {
      echo "<h3 class='text-uppercase'>HASIL KINERJA </br> <p class='font-weight-bold text-danger'> $data[nama] </p> </h3>";
      }
      ?>
      <em><!-- tampil nama end --></em>
      </div>
      <div class="card-body">
        <em><!-- <form class="form-inline my-2 my-lg-0 pt-2 pb-2"></em>

<em> &lt;input class="form-control mr-sm-2" type="search" placeholder="Filter tanggal" aria-label="Search" id="myInput" onkeyup="myFunction()" &gt;</em> <em> &lt;/form&gt; --&gt;</em> <em>&lt;!-- table --&gt;</em> &lt;div &gt; &lt;div class="table-responsive table-fixed table-wrapper"&gt; &lt;table class="table table-bordered table-striped table-fixed text-center" id="myTable"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th scope="col"&gt;No&lt;/th&gt; &lt;th scope="col"&gt;ID&lt;/th&gt; &lt;th scope="col"&gt;Nama&lt;/th&gt; &lt;th scope="col"&gt;Golongan&lt;/th&gt; &lt;th scope="col"&gt;Nilai Output&lt;/th&gt; &lt;th scope="col"&gt;Penilaian Atasan&lt;/th&gt; &lt;th scope="col"&gt;Nilai Learning&lt;/th&gt; &lt;th scope="col"&gt;Nilai Kedisiplinan&lt;/th&gt; &lt;th scope="col"&gt;Nilai 5R&lt;/th&gt; &lt;th scope="col"&gt;Hasil&lt;/th&gt; &lt;th scope="col"&gt;Tanggal&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; <em>&lt;!-- query --&gt;</em> &lt;?php $no = 0; $query = "SELECT * FROM user where id= $_SESSION[id]";

              $query = "SELECT user.id,user.nama,golongan,nilai_output,nilai_atasan,nilai_learning,nilai_kedisiplinan,nilai_5r,overall,tanggal 
                        FROM tkaryawan 
                        JOIN user 
                        ON user.id=tkaryawan.id 
                        where user.id= $_SESSION[id] 
                        ORDER BY tanggal DESC";

              $result = mysqli_query($koneksi, $query);
              
              if(!$result){
                die ("Query Error: ".mysqli_errno($koneksi).
                " - ".mysqli_error($koneksi));
              }
              while($data = mysqli_fetch_assoc($result))
              {
                $no++;
                ?>

                <tr>
                  <th scope="row"><?php echo $no; ?></th>
                  <td><?php echo $data['id'];?></td>
                  <td class="text-capitalize"><?php echo $data['nama'];?></td>
                  <td><?php echo $data['golongan'];?></td>
                  <td><?php echo $data['nilai_output'];?></td>
                  <td><?php echo $data['nilai_atasan'];?></td>
                  <td><?php echo $data['nilai_learning'];?></td>
                  <td><?php echo $data['nilai_kedisiplinan'];?></td>
                  <td><?php echo $data['nilai_5r'];?></td>
                  <td class="font-weight-bold text-danger"><?php echo $data['overall'];?></td>
                  <td class="text-secondary"><?php echo $data['tanggal'];?></td>
                <tr>
              <?php
              }

              mysqli_free_result($result);

              mysqli_close($koneksi);
              ?>
            <tbody>
          </table>
        </div>
        <em><!-- table end --></em>
      </div>
    </div>
    <em><!-- card end --></em>

  </div>
  <em><!-- container end --></em>
</div>
<em><!-- jumbotron end --></em>

<em>&lt;!-- script --&gt;</em> &lt;script src="js/custom.js"&gt;&lt;/script&gt; &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt; &lt;script&gt; $(document).ready(function(){ $('#myTable').DataTable(); }); &lt;/script&gt;

&lt;/body&gt; &lt;/html&gt;</pre><div><br>Semoga membantu!</div>