Bootstrap dataTable没有在php表中排序和搜索

时间:2016-10-19 13:27:24

标签: php mysql twitter-bootstrap datatable

我是一个有一个控制器页面来运行mysql查询的站点。它将结果输出到名为m_analitica.php的查看器页面,其中include("header.php")位于顶部,include("footer")位于底部。

m_analitica.php的代码:

<div>
<table class="table table-striped table-bordered table-hover" id="myTable">
    <div><h2>Mapa Analítica</h2></div>
    <thead>
        <tr>
            <th>Name</th>
            <th>Tipo Documento</th>
            <th>Número</th>
            <th>Cliente</th>
            <th>Obra</th>
            <th>Designação</th>
            <th>Agregado</th>
            <th>Quantidade (ton)</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Name</th>
            <th>Tipo Documento</th>
            <th>Número</th>
            <th>Cliente</th>
            <th>Obra</th>
            <th>Designação</th>
            <th>Agregado</th>
            <th>Quantidade (ton)</th>
        </tr>
    </tfoot>


    <?php foreach ($positions as $position): ?>
        <tbody>
            <tr>
                <td><?= $position["data"] ?></td>
                <td><?= $position["tipo"] ?></td>
                <td><?= $position["num"] ?></td>
                <td><?= $position["cliente"] ?></td>
                <td><?= $position["obra"] ?></td>
                <td><?= $position["nome_obra"] ?></td>
                <td><?= $position["agr"] ?></td>
                <td><?= $position["ton"] ?></td>
            </tr>
        </tbody>
    <?php endforeach ?>
</table>

header.php head 中,我包含了以下js脚本和CSS:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="../public/js/DataTables-1.10.12/media/css/dataTables.bootstrap.min.css" />
<link href="../public/css/bootstrap.min.css" rel="stylesheet"/>
<script src="../public/js/bootstrap.min.js"></script>
<script src="../public/js/DataTables-1.10.12/media/js/jquery.dataTables.min.js"></script>
<script src="../public/js/DataTables-1.10.12/media/js/dataTables.bootstrap.min.js"></script>

然后在footer.php中的body元素闭包之前,我插入了脚本:

<script type="text/javascript">
    $('#myTable').dataTable();
</script>

我得到格式正确,除了它没有将表格分成页面,搜索和排序不起作用,它没有点击它们。

bootstrap dataTable不能与php一起使用吗?或者使用foreach循环?或者他的代码有问题。

1 个答案:

答案 0 :(得分:1)

从循环内删除<tbody>标记。您只想重复<tr>标记。将<tbody>标记放在循环之外。