php输入后如何让js运行?

时间:2016-01-06 07:53:40

标签: javascript php jquery

我试图将数据表添加到我的网站,但我有一个问题,即代码将在完成具有HTML和PHP的输入后不应用js代码。 这是我的js代码:

$(document).ready(function() {
$('#example').DataTable( {
    responsive: {
        details: {
            display: $.fn.dataTable.Responsive.display.modal( {
                header: function ( row ) {
                    var data = row.data();
                    return 'Details for '+data[0]+' '+data[1];
                }
            } ),
            renderer: function ( api, rowIdx, columns ) {
                var data = $.map( columns, function ( col, i ) {
                    return '<tr>'+
                            '<td>'+col.title+':'+'</td> '+
                            '<td>'+col.data+'</td>'+
                        '</tr>';
                } ).join('');

                return $('<table class="table"/>').append( data );
            }
        }
    }
} );
} );

这是我的HTML代码:

<thead>
        <tr>
            <th>STT</th>
            <th>Tên sản phẩm</th>
            <th>Ngày sản xuất</th>
            <th>Mã sản phẩm</th>
            <th>Vị trí lắp đặt</th>
            <th>Chủng loại</th>
            <th>Nhóm</th>
            <th>Dự án</th>
            <th>Nhà sản xuất</th>
            <th>Miêu tả sản phẩm</th>
            <th>Lỗi</th>
            <th>Cấp độ</th>
            <th>Miêu tả lỗi</th>
            <th>Người khắc phục</th>
            <th>Thời gian khắc phục</th>
            <th>Chi tiết lỗi</th>
            <th style="width:1%; text-align:center">Hành động</th>
        </tr>
    </thead> 
    <tbody>

这是php代码

$stt= 1;
    $sql= "SELECT * from fixed ORDER BY sta ASC, level ASC";
    //thuc hien cau lenh voi bien conn lay tu file connection.php
    $query= mysqli_query($conn, $sql);
    while ($data=mysqli_fetch_array($query)){
?>
    <tr>
        <td scope="row"><?php echo $stt++?></td>
        <td><?php echo $data["ten_sp"]?></td>
        <td><?php echo $data["ngay_sx"]?></td>
        <td><?php echo $data["ma_sp"]?></td>
        <td><?php echo $data["vitrilapdat"] ?></td>
        <td><?php echo $data["chungloai"] ?></td>
        <td><?php echo $data["nhom"] ?></td>
        <td><?php echo $data["d_an"] ?></td>
        <td><?php echo $data["nhasx"] ?></td>
        <td><?php echo $data["mieuta"] ?></td>
        <td><?php echo $data["loi"] ?></td>
        <td>
            <?php
            if($data["level"] == 1){
                echo '<p style="color: red;">Khẩn cấp</p>';
            }else if($data["level"] == 2){
                echo '<p style="color: #00b300;">Quan trọng</p>';
            } else if($data["level"] == 3){
                echo '<p style="color: #0000cc;">Cần lưu ý</p>';
            }
                        ?>  
        </td>
        <td><?php echo $data["mieutaloi"] ?></td>
        <td><?php echo $data["nguoikhacphuc"] ?></td>
        <td><?php echo $data["thoigian"] ?></td>
        <td><?php echo $data["chitiet"] ?></td>
        <td><a href="prod_fixed_editinfo.php?id=<?php echo $data["id"]?>" class="btn btn-info btn-sm" role="button">
            <?php 
            if($data["sta"] == 1){

                    echo "Un-read";
                    }else{
                        echo "Read";
                        } ?></a></td>

        <td><a href="prod_fixed_delete.php?id=<?php echo $data["id"]?>" class="btn btn-danger btn-sm" role="button">Xóa</a></td>
    </tr>
    <?php
    }
    ?>

这是我得到的结果: enter image description here

我想要这样的结果: enter image description here

这是这张照片的代码:(与第一张照片相同的js和样式)

<thead>
        <tr>
            <th>First name</th>
            <th>Last name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
            <th>Extn.</th>
            <th>E-mail</th>
            <th>Extn.</th>
            <th>E-mail</th>
            <th>Extn.</th>
            <th>E-mail</th>
            <th>Extn.</th>
            <th>E-mail</th>
            <th>Extn.</th>
            <th>E-mail</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger</td>
            <td>Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
        </tr>
        <tr>
            <td>Vivian</td>
            <td>Harrell</td>
            <td>Financial Controller</td>
            <td>San Francisco</td>
            <td>62</td>
            <td>2009/02/14</td>
            <td>$452,500</td>
            <td>9422</td>
            <td>v.harrell@datatables.net</td>
            <td>9422</td>
            <td>v.harrell@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
        </tr>
        <tr>
            <td>Michael</td>
            <td>Bruce</td>
            <td>Javascript Developer</td>
            <td>Singapore</td>
            <td>29</td>
            <td>2011/06/27</td>
            <td>$183,000</td>
            <td>5384</td>
            <td>m.bruce@datatables.net</td>
            <td>9422</td>
            <td>v.harrell@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
        </tr>
        <tr>
            <td>Donna</td>
            <td>Snider</td>
            <td>Customer Support</td>
            <td>New York</td>
            <td>27</td>
            <td>2011/01/25</td>
            <td>$112,000</td>
            <td>4226</td>
            <td>d.snider@datatables.net</td>
            <td>9422</td>
            <td>v.harrell@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
             <td>5421</td>
            <td>t.nixon@datatables.net</td>
        </tr>
    </tbody>

我认为这里的问题是从PHP代码输入所有信息后js代码将无法运行,但我不知道如何解决这个问题,你能帮忙吗?

2 个答案:

答案 0 :(得分:1)

1 /首先,再次检查元素id #example,不管你有没有,它必须是这样的东西:

<table id="example">

 <thread>
  <tr>
   <th></th>
  </tr>      
 </thread>

 <tbody>
  <tr>
   <td></td>
  </tr>      
 </tbody>

</table>

2 /秒,确保将DataTable js的链接添加到具有正确路径的页面,例如:

<link href="css/dataTables.bootstrap.css" rel="stylesheet">

<link href="css/dataTables.responsive.css" rel="stylesheet">

<script src="js/jquery.dataTables.min.js"></script>

<script src="js/dataTables.bootstrap.min.js"></script>

<script src="js/yourscript.js"></script>

3 /三,尝试删除php代码,创建一个普通表,看看js是否正常工作..?

答案 1 :(得分:0)

非常感谢你的帮助,我的代码错了,因为我在选择代码中使用了order by,也许我添加了val nbr = List(1,2,2,3,3,3,4,4,4,4) val nbrs = sc.parallelize(nbr) var lb = 1 var incr = 1 var ub = lb + incr val nbrsMap = nbrs.map(rec => { if(rec > ub) { lb = rec ub = lb + incr } (lb.toString + ":" + ub.toString, 1) }) nbrsMap.reduceByKey((acc, value) => acc + value).foreach(println) (1:2,3) (3:4,7) 而不是<td>,我今天早上意识到了这一点。 /> 非常感谢你帮我解决这个问题。