Why is my datatables not showing out ?

Why is my datatables not showing out ?

Leon MATATALeon MATATA Posts: 2Questions: 2Answers: 0
edited November 2023 in Free community support
<?php
session_start();
include('database.php');
include('NavBar.php');
?>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href='https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css' rel='stylesheet'>
  <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css' >
  <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css'>
  <link rel='stylesheet' href=' https://cdn.datatables.net/1.13.7/css/dataTables.bootstrap5.min.css'>
 
  <link rel="stylesheet" href="style.css">
  <script defer src = "https://code.jquery.com/jquery-3.7.0.js" ></script>
  <script defer src = "https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js" ></script>
  <script defer src = "https://cdn.datatables.net/1.13.7/js/dataTables.bootstrap5.min.js" ></script>
  <script defer src = "datatable.js"></script>
  <title>Happy Talk Administration Page</title>
</head>
<body>

  ![](https://datatables.net/forums/uploads/editor/yt/3matwor7jqq9.png "")
<div id="layoutSidenav_content">
  <div class="card shadow mb-4">
    <div class="card-header py-3">
      <div class="button-container">
      </div>
    </div>
    </div>
    <div class="card-body">
    


      <div class="table-responsive">
        <?php
        $connection = mysqli_connect("localhost", "root", "", "adminpanel");
        $sql = "SELECT * FROM booking";
        $result = mysqli_query($connection, $sql);

        if (mysqli_num_rows($result) > 0) {
          ?>
         <table class="table table-bordered" id="datatable" width="100%" cellspacing="0%">
  <thead>
  <tr>
  <th>Booking ID</th>
  <th>Customer Name</th>
  <th>Customer Phone number</th>
  <th>Customer Email</th>
  <th>Number of Customer</th>
  <th>Date and Time</th>
  <th>Status</th>
  <th colspan="2" style="text-align: center;">Action</th>
</tr>
</thead>
<tbody>
<?php
while ($row = mysqli_fetch_assoc($result)) {
?>
  <tr>
    <td><?php echo $row['bookingID']; ?></td>
    <td><?php echo $row['book_name']; ?></td>
    <td><?php echo $row['book_phone']; ?></td>
    <td><?php echo $row['book_email']; ?></td>
    <td style="text-align: center;"><?php echo $row['person']; ?></td>
    <td><?php echo $row['date']; ?></td>
    <td><?php echo $row['Status']; ?></td>
    <td style="text-align: center;">
      <form action="send-booking-approval.php" method="POST">
        <input type="hidden" name="approve_id" value="<?php echo $row['bookingID']; ?>">
        <button type="submit" name="approve_idbtn" class="btn btn-success">Approve</button>
      </form>
    </td>
    <td style="text-align: center;">
      <form action="send-booking-reject.php" method="POST">
        <input type="hidden" name="reject_id" value="<?php echo $row['bookingID']; ?>">
        <button type="submit" name="reject_idbtn" class="btn btn-danger">Reject</button>
      </form>
    </td>
  </tr>
<?php
}
?>
</tbody>

</table>
          <?php
        } else {
          echo "No Records Found";
        }
        ?>
  </div>
</div>
<?php 
include('includes/scripts.php');
?>




<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>

Why is the data table not functioning?

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Answers

  • colincolin Posts: 15,095Questions: 1Answers: 2,581

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Colin

  • allanallan Posts: 61,044Questions: 1Answers: 9,955 Site admin

    <th colspan="2" style="text-align: center;">Action</th>

    You are probably getting an error thrown in your browser's console. DataTables 1 requires that each column have a unique header cell. The upcoming DataTables 2 relaxes that constraint.

    Beyond that, as Colin (and the forum rules) says, we'd need a test case.

    Allan

Sign In or Register to comment.