dongting3135
2018-11-08 14:38
浏览 77

DataTables无法应用于表

I'm trying to use DataTables but for some reason, it doesn't seem to be working. I'm using Bootstrap 4 and I need buttons from DataTables so that I can export the table later. I think I've added everything I need but it's not showing up. anyone know why it hasn't worked? The table is being posted from a database, it works just fine in bootstrap and all the information shows up but as soon as I try to add DataTables to it nothing seems to change.

 <?php 
    ini_set('display_errors', 1);
    ini_set('display_startup_errors', 1);
    error_reporting(E_ALL);

    include_once('connection.php');
    if($_SERVER['REQUEST_METHOD'] == "POST" and isset($_POST['someAction']))
        {
            func();
        }
        function func()
        {
          $conn = mysqli_connect("localhost", "root", "", "SportsDB");
        }
    session_start();
    if( !isset($_SESSION['username']) ){ /* Change into role = teacher or admin*/
      header('Location:login.php');
    }

    print_r($_SESSION);
    ?>

    <!DOCTYPE html>
    <html lang='en'>
    <head>
      <meta charset="UTF-8">
      <title>Register exporting</title>
      <!--- Link to Bootstrap 4 -->
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
      <!-- Link to Data Tables -->
      <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.4/b-flash-1.5.4/b-html5-1.5.4/datatables.min.css"/>

      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
      <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
      <script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.4/b-flash-1.5.4/b-html5-1.5.4/datatables.min.js"></script>

      <!-- Link to jquery -->
      <script
      src="http://code.jquery.com/jquery-3.3.1.min.js"
      integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
      crossorigin="anonymous"></script>

    </head>
    <body>
      <div class='container-fluid' style='margin-top: 20px'>
        <div class="row">
          <div class="col-md-8 mx-auto">
            <table class="table table-bordered table-hover" id='example'>
              <thead>
                <tr>
                  <td>ID</td>
                  <td>Username</td>
                  <td>T1_choice</td>
                  <td>T2_choice</td>
                  <td>T3_choice</td>
                </tr>
              </thead>
              <tfoot>
                <tr>
                  <td>ID</td>
                  <td>Username</td>
                  <td>T1_choice</td>
                  <td>T2_choice</td>
                  <td>T3_choice</td>
                </tr>
              </tfoot>
              <tbody>
                <?php
                  ini_set("display_errors", 1);
                  $stmt = $conn->query('SELECT * FROM Student_Choices');
                  while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
                    echo '<tr>
                        <td>'.$row['Unique_ID'].'</td>
                        <td>'.$row['Username'].'</td>
                        <td>'.$row['T1_Choice'].'</td>
                        <td>'.$row['T2_Choice'].'</td>
                        <td>'.$row['T3_Choice'].'</td>
                      </tr>
                    ';
                  }
                ?>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    <script type="text/javascript">
      $(document).ready(function() {
        $('#example').DataTable();
      } );
    </script>
    </body>
    </html>
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • duandi5328 2018-11-08 15:04
    已采纳

    Thanks for the help. I needed to call the jquery before DataTables.

    已采纳该答案
    打赏 评论

相关推荐 更多相似问题