如何在动态表行中配置datatable插件通过ajax创建

时间:2018-01-16 10:38:42

标签: php jquery mysql ajax datatables

我通过My​​sql数据库获取数据。数据很大,所以我使用datatable插件在表格下面创建分页。 Datatable插件可以正常使用静态表,但是当我将它配置到我的动态数据表时,它无法正常工作。我不知道如何实现这个。

这是我的ajax文件:

<?php
if(isset($_GET['name'])){
 $name = $_GET['name'];
$query = mysql_query("select id,card_name,phone1,address,region,country,cert_num,category_cod,material_cod,trade_type,web from pdbp inner join bp on(pdbp.bp_id=bp.id) where bp.status= 1 and card_name like '%$name%'");

 while($data = mysql_fetch_assoc($query)){
     $id = $data['id'];
     $name = $data['card_name'];
     $phone1 = $data['phone1'];
     $region = $data['region'];
     $trade_type = $data['trade_type'];
     $web = $data['web']; 
     $country = $data['country'];
     $cat = $data['category_cod'];
     $mat = $data['material_cod'];


     $retval=$retval."<tr><td>".++$counter."</td><td> ".$name." </td><td> ".$phone1." </td><td> ".$region." </td><td> ".$cat." </td><td> ".$mat." </td><td> ".$trade_type."</td><td> ".$web."</td></tr>";
 }

echo $retval;
}
?>

这是我的第二个文件:

<table id="datatables" border="1">
                            <thead>
                            <tr>
                                <th>Sr No.</th>
                                <th>
                                    Name
                                </th>
                                <th>
                                    Telephone
                                </th>

                                <th>
                                    Categories
                                </th>
                                <th>
                                    Material
                                </th>
                                <th>
                                    Type
                                </th>
                                <th> Website </th>


                            </tr>
                            </thead>
                            <tbody id="datas">

                            </tbody>
                            </table>
<link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css">
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>       
<script type="text/javascript" language="javascript" src="js/jquery.dataTables.js"></script>
<script>
$(document).ready(function () {
    $('#datatables').DataTable()

    $("#cmp_name").keyup(function(){
        $.ajax({
             'url':"filter.php",
            'data':{name:$("#cmp_name").val()},
            'method':'GET',
            'success':function(name){

                 $("#datas").html(name);            
            }
        })

  });

});

</script>

如何整合数据表插件?

0 个答案:

没有答案