我的数据表不工作，即使它在我的另一个页面上工作

Question

这里是新手。我的数据table 不工作。但是，它在我的另一页上完全有效。这很奇怪，因为我只是做了和以前一样的事情。我在这里错过了什么吗？我在下面提供了更多解释、屏幕截图和代码。任何帮助将不胜感激。非常感谢。

//这些代码来自ewallet.php。这里的数据table不工作

html:

<div class="card-body table-responsive p-0"> 
<!--   tab cont -->
       <div class="tab-content" id="custom-tabs-two-tabContent">
       
<!--        PENDING -->
         <div class="tab-pane fade show active" id="custom-tabs-two-pending" role="tabpanel" aria-labelledby="custom-tabs-two-pending-tab">
                    <table class="table-head-fixed text-nowrap table-striped" id="example"> // i triggered it here using id="example"
                  <thead>
                    <tr>

                      <th><i class="fas fa mr-2"></i>DATEE</th>
                       <th><i class="fas fa mr-2"></i>NAME</th>
                      <th><i class="fas fa mr-2"></i>AMOUNT</th>
                      <th><i class="fas fa mr-2"></i>STATUS</th>
                      <th><i class="fas fa mr-2"></i>ACTION</th>
                    </tr>
                  </thead>
                  <tbody id="myTable"> 
                    <tr>
                       <?php 
                    foreach($result as $rows) {     ?> 
                   <?php if($rows->status==='pending'){ ?>
                <tr>
                <td><?php echo $rows->dateRequested; ?></td>
                <td><?php echo $rows->firstname; ?></td>
                <td><?=number_format($rows->amount, 2);?></td>
                <td><?php echo $rows->status; ?></td>
                <td>
            <button data-mdb-toggle="tooltip" title="Hi! I'm tooltip" data-amounted="<?php echo $rows->amount?>" data-id="<?php echo $rows->userID; ?>"  data-trans="<?php echo $rows->transID;?>"  data-usernamee="<?php echo $rows->username; ?>" ustatus="approved" class="btn-sm showmodal fundTable btn btn-success text-bold user_status">
<i class="fas fa-check-square"></i></button>
                   

                 <button data-id="<?php echo $rows->transID;?>"  data-us="<?php echo $rows->userID?>" class="showmodal1 fundTable btn btn-danger btn-sm text-bold"> 
                <i class="fas fa-window-close"></i>
                 </button>
                 
                  <button data-id="<?php echo $rows->transID?>" data-amounts="<?php echo $rows->amount?>" data-stats="<?php echo $rows->status?>" data-type="<?php echo $rows->account_type?>" data-use="<?php echo $rows->username?>" data-user="<?php echo $rows->userID; ?>" data-toggle="modal" data-target="#infos" class="showmodal9 fundTable btn btn-info btn-sm text-bold">
                <i class="fas fa-info-circle"></i>
                </button>
                
                <?php } ?>  
                
               <?php }  ?>   
            </td>   
            </tr>   
            
                  </tbody>
                </table>
                </div>

脚本：

<script>
$(document).ready(function() {
    $('#example').DataTable( {
    
        dom: 'Bfrtip',
        
        buttons: [
             {
                extend:    'copyHtml5',
                text:      '<i class="far fa-copy mr-2"></i>Copy',
                titleAttr: 'Copy'
            }, 
            {
                extend:    'excelHtml5',
                text:      '<i class="fas fa-file-excel mr-2"></i> Excel',
                titleAttr: 'Excel'
            },
            {
                extend:    'csvHtml5',
                text:      '<i class="fas fa-file-csv mr-2"></i> CSV',
                titleAttr: 'CSV'
            }, 
            {
                extend:    'pdfHtml5',
                text:      '<i class="far fa-file-pdf mr-2"></i> PDF',
                titleAttr: 'PDF'
            },
            {
                extend:    'printHtml5',
                text:      '<i class="fas fa-print mr-2"></i> Print',
                titleAttr: 'PRINT'
            } 
            
  
        ]
        
      
    } );

} );
</script>

控制台日志错误：

Uncaught TypeError: Cannot read property 'getContext' of undefined
    at HTMLDocument.<anonymous> (dashboard.js:68)
    at e (jquery.min.js:2)
    at t (jquery.min.js:2)
jquery.min.js:2 Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined
    at Za (jquery.dataTables.min.js:41)
    at ea (jquery.dataTables.min.js:32)
    at HTMLTableRowElement.<anonymous> (jquery.dataTables.min.js:33)
    at jquery.min.js:2
    at Function.map (jquery.min.js:2)
    at k.fn.init.map (jquery.min.js:2)
    at Ga (jquery.dataTables.min.js:33)
    at f (jquery.dataTables.min.js:109)
    at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:110)
    at Function.each (jquery.min.js:2)

Answer 1

看起来你的代码中有一些额外的 TR：

<tr> **Extra TR first one after tbody**

<?php 
                        foreach($result as $rows) {     ?> 
                       <?php if($rows->status==='pending'){ ?>
                    <tr>
                        <td><?php echo $rows->dateRequested; ?></td>
                        <td><?php echo $rows->firstname; ?></td>
                        <td><?=number_format($rows->amount, 2);?></td>
                        <td><?php echo $rows->status; ?></td>
                        <td>
                    <button data-mdb-toggle="tooltip" title="Hi! I'm tooltip" data-amounted="<?php echo $rows->amount?>" data-id="<?php echo $rows->userID; ?>"  data-trans="<?php echo $rows->transID;?>"  data-usernamee="<?php echo $rows->username; ?>" ustatus="approved" class="btn-sm showmodal fundTable btn btn-success text-bold user_status">
    <i class="fas fa-check-square"></i></button>
                       
    
                     <button data-id="<?php echo $rows->transID;?>"  data-us="<?php echo $rows->userID?>" class="showmodal1 fundTable btn btn-danger btn-sm text-bold"> 
                    <i class="fas fa-window-close"></i>
                     </button>
                     
                      <button data-id="<?php echo $rows->transID?>" data-amounts="<?php echo $rows->amount?>" data-stats="<?php echo $rows->status?>" data-type="<?php echo $rows->account_type?>" data-use="<?php echo $rows->username?>" data-user="<?php echo $rows->userID; ?>" data-toggle="modal" data-target="#infos" class="showmodal9 fundTable btn btn-info btn-sm text-bold">
                    <i class="fas fa-info-circle"></i>
                    </button>
                    
                    <?php } ?>  
                    
                   <?php }  ?>   
                </td>   
                </tr>

我的数据表不工作，即使它在我的另一个页面上工作

My datatable is not working even though it is working on my onother page

html

jquery

codeigniter