Bootstrap таблицы данных показывают дубликаты записей

Question

Я использую Bootstrap таблицы данных для отображения записей, извлеченных из базы данных. Sql запрос работает отлично. но когда данные отображаются в таблице данных, появляются повторяющиеся записи. Ниже приведен мой код ============================================== CODE ===== ====================================================

<table class="table table-sm m-0 table-hover" id="table-x" data-id-table="advancedTable" data-pagination="true" data-show-pagination-switch="true" data-search="true" data-search-align="left" data-advanced-search="true" data-toolbar="#toolbar"
          data-show-toggle="true" data-show-columns="true" data-show-export="true" data-show-button-text="true" data-sort-class="table-active" data-show-print="true">
          <thead>
            <tr>
              <th data-sortable="true" class="table-col-60" data-field="serial No"> Sr: no</th>
              <th data-sortable="true" class="table-col-200" data-field="Project Name">Project Name</th>
              <th data-sortable="true" class="table-col-80" data-field="Project Value ">Project Value </th>
              <th data-sortable="true" class="table-col-80" data-field="Awarded Date">Awarded Date</th>
              <th data-sortable="true" class="table-col-120" data-field="Completion date">Completion Date </th>
            </tr>
          </thead>
            <?php
                $result = mysqli_query($con, "Select * FROM projects WHERE proj_status= 'awarded'");

                while ($row = mysqli_fetch_array($result))
                { 
            ?>
              <tbody class="table-body">
                <tr>
                    <td>    <?php echo $row['sr_no'];   ?>      
                    </td>
                    <td data-toggle="modal" data-target="#id1"> 
                        <div class="text-effect" >  
                            <strong><?php echo $row['proj_name'];?></strong>
                        </div>
                    </td>
                    <td>    
                        <div class="table-col-80">
                            <?php echo $row['finan_val'];?>
                        </div>
                    </td>
                    <td>
                        <div class="table-col-80">
                            <?php echo $row['proj_st_date'];?>
                        </div>
                    </td>
                    <td>
                        <div class="table-col-120">
                            <?php echo $row['exp_comp_date'];?>
                        </div>
                    </td>
                </tr>
             </tbody>
            <?php
                }
            ?>
        </table>

<script>
$(document).ready(function() {
  $('#table-x').DataTable();
});

================ отображаемые данные ==================== ===

Answer 1

Потому что вам нужно добавить перед использованием, пока l oop.

<table class="table table-sm m-0 table-hover" id="table-x" data-id-table="advancedTable" data-pagination="true" data-show-pagination-switch="true" data-search="true" data-search-align="left" data-advanced-search="true" data-toolbar="#toolbar"
          data-show-toggle="true" data-show-columns="true" data-show-export="true" data-show-button-text="true" data-sort-class="table-active" data-show-print="true">
          <thead>
            <tr>
              <th data-sortable="true" class="table-col-60" data-field="serial No"> Sr: no</th>
              <th data-sortable="true" class="table-col-200" data-field="Project Name">Project Name</th>
              <th data-sortable="true" class="table-col-80" data-field="Project Value ">Project Value </th>
              <th data-sortable="true" class="table-col-80" data-field="Awarded Date">Awarded Date</th>
              <th data-sortable="true" class="table-col-120" data-field="Completion date">Completion Date </th>
            </tr>
          </thead>
            <?php
                $result = mysqli_query($con, "Select * FROM projects WHERE proj_status= 'awarded'");

<tbody class="table-body">

                while ($row = mysqli_fetch_array($result))
                { 
            ?>

                <tr>
                    <td>    <?php echo $row['sr_no'];   ?>      
                    </td>
                    <td data-toggle="modal" data-target="#id1"> 
                        <div class="text-effect" >  
                            <strong><?php echo $row['proj_name'];?></strong>
                        </div>
                    </td>
                    <td>    
                        <div class="table-col-80">
                            <?php echo $row['finan_val'];?>
                        </div>
                    </td>
                    <td>
                        <div class="table-col-80">
                            <?php echo $row['proj_st_date'];?>
                        </div>
                    </td>
                    <td>
                        <div class="table-col-120">
                            <?php echo $row['exp_comp_date'];?>
                        </div>
                    </td>
                </tr>

            <?php
                }
            ?>

<script>
$(document).ready(function() {
  $('#table-x').DataTable();
});

Answer 2

В одной таблице должен быть только один тег tbody, поэтому, если вы переместите тег tbody из while l oop, он будет работать: D