如何正确使用DATATABLE

时间:2017-04-05 08:24:46

标签: javascript php jquery html datatable

            <table id="tbl" class = "table table-striped table-bordered" style="border-top:0px;">
      <thead>
        <tr>
          <th></th>
          <th><p style="text-align:center;">Answered</p></th>
          <th><p style="text-align:center;">Post</p></th>
          <th><p style="text-align:center;">Views</p></th>
        </tr>
      </thead>
      <tbody>
          <?php
          $res = $db->viewquestion();
            $ask_id= '';
          foreach ($res as $key => $value) {
              $ask_id = $value['iask_id'];

            ?> 

      <tr>
        <td>
          <div align="left" width="400">
            <?php echo '<a href="askpriest?iask_title='.$value['iask_title'].'">'?>
            <img src="./<?php echo $value['image']; ?>" style="border-radius:50%;float:left" width="20%" height="20%" class="pull-left"> 
            <h5><strong class="font-1-2" style="color:#59960b;border-radius:50%;float:left"><?php echo $value['iask_title']?></strong></h5>
            <br><p class="font-1-2" style="color:#000000;border-radius:50%;font-size:12px;float:left">by:<?php echo $value['firstname'].' '.$value['lastname'].' '. $value['date_send'].'<br> in '.$value['iask_topic'] ?> </p> 
             </a>
          </div>
        </td>
        <td>
          <?php
            if($value['iask_answered']==1){
          ?>
            <p align="center" style="padding-top:20px;"><span  class="fa fa-check" style="color:#59960b;"></span></p>
          <?php
            }else{
          ?> 
            <p align="center" style="padding-top:20px;font-size:30px;"><span style="color:#59960b;"></span></p>
          <?php
            }
          ?>
        </td>
          <td>
            <p class="font-1-5" style="padding-top:25px;text-align:center;" width="80"><?php echo $value['iask_post']?></p>
          </td>
          <td> 
            <p class="font-1-5" style="padding-top:25px;text-align:center;"><?php echo $value['iask_view']?> </p>
          </td>
          </div>
       </tr>
          <?php 
            }
          ?>
      </tbody>
      </table>

所以我有这个表,我试图使用数据表js ..

 <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css"/>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src=" //code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
      $(document).ready(function() {
            $('#tbl').DataTable();
          });
</script>

但不幸的是,桌子上没有任何事情发生..我试着在网上搜索,他们说应该是平等的..所以我试着计算多少是和他们是平等的..我不知道怎么样解决这个问题,因为我得到的唯一答案是并且应该是平等的...... hel

2 个答案:

答案 0 :(得分:0)

您的表的ID等于&#34; tbl&#34;所以代码应该是

 $(document).ready(function() {
           $('#tbl').DataTable();
   });

答案 1 :(得分:0)

您可以使用<table id="data_table"> <thead> <tr> <th>Emp Code</th> <th>First Name</th> <th>Last Name</th> <th>Mobile</th> </tr> </thead> <tbody> <!-- Dynamic Body --> </tbody> </table> 之类的:

HTML:

$(document).ready(function() {
    var data = [];
    data.push(
        [1,"Sasha","Brenna","0800 1111"],
        [2,"Sage","Mia","(01012) 405872"],
        [3,"Chelsea","Allistair","076 0578 0265"],
        [4,"Uta","Savannah","070 1247 5884"],
        [5,"Remedios","Berk","0995 181 0007"],
        [6,"Ruby","Wayne","0800 1111"],
        [7,"Faith","Fredericka","(01709) 099879"],
        [8,"Myra","Harrison","070 4241 9576"],
        [9,"Drake","Miriam","0800 733635"],
        [10,"Reed","Shannon","076 8597 5067"]
    );

    $('#data_table').DataTable( {
        data: data,
    });
});

Jquery的:

init.php

Working Fiddle