Bootstrap数据表样式

时间:2017-10-02 11:52:40

标签: jquery css twitter-bootstrap

我正在使用Bootstrap和jQuery datatables插件。现在它同时显示默认样式和Bootstrap样式。例如,分页显示默认分页按钮内的引导按钮。

pi@raspberrypi:~ $ sudo mysql -u root
Welcome to the MariaDB monitor.  Commands end with ; or \g.
Your MariaDB connection id is 17
Server version: 10.1.23-MariaDB-9+deb9u1 Raspbian 9.0

Copyright (c) 2000, 2017, Oracle, MariaDB Corporation Ab and others.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

MariaDB [(none)]> 

我认为脚本顺序是正确的。可能是什么问题呢?我是否必须在数据表上设置一些东西才能使用bootstrap?

1 个答案:

答案 0 :(得分:2)

尝试使用以下链接替换bootstrap和datatables css:https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css

这些是此处示例中给出的样式表:https://datatables.net/examples/styling/bootstrap.html

它看起来像(在示例中)

的链接
src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js">

必须在

之前引用
 src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap.min.js">

另外

通过查看代码,您遗漏了标记中的<tbody>标记。数据表的This is essential。您的标记/ PHP应如下所示:

<table class="table-bordered table-hover table-fixed" id="mytable">
    <thead>
       <tr>
         <th>Confimar</th>
         <th>Árbol Completo</th>
         <th>Títol</th>
         <th>Descripció</th>
         <th>Code</th>
         <th>Parent Code</th>
       </tr>
    </thead>
    <tbody>
         <?php
            if ($stmt = sqlsrv_query($conn,$query)) 
            {
              while($tmp = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_NUMERIC)) 
              {
                 //remember to echo out a row for each line returned in the loop
                 echo '<tr>';
                 echo setTableFile($tmp);
                 echo '</tr>'
              }
            }
         ?>
   </tbody>
</table>