Table controls do not work

Table controls do not work

konsyr11konsyr11 Posts: 6Questions: 1Answers: 0

Link to test case: https://acmeplugins.cf/demo/masswhitelist/application/all_apps.php
Debugger code (debug.datatables.net): ujetup
Error messages shown: None
Description of problem: All datatable controls are gone. This includes pagination, sorting, search etc. I remember it working, and I have never touched the JavaScript files, I have left them how they came with the template I am using. I do not understand why it just broke, and how. I have checked all dependencies, tried changing the table ID, confirmed that answered questions did not fix the problem. I shall note that the table is pulling data from MySQL using PHP (snippet attached below), and bServerSide is set to false.
Table code snippet:

<!-- DataTables -->
<div class="card shadow mb-4">
  <div class="card-header py-3">
    <h6 class="m-0 font-weight-bold text-primary">Pending Applications</h6>
  </div>
  <div class="card-body">
    <div class="table-responsive">
      <table class="table table-bordered" id="example" width="100%" cellspacing="0">
        <thead>
          <tr>
            <th>ID</th>
            <th>Skin</th>
            <th>Minecraft Username</th>
            <th>Timestamp</th>
            <th>Status</th>
            <th>Actions</th>
          </tr>
        </thead>
        <tfoot>
          <tr>
            <th>ID</th>
            <th>Skin</th>
            <th>Minecraft Username</th>
        <th>Timestamp</th>
            <th>Status</th>
        <th>Actions</th>
          </tr>
        </tfoot>
        <tbody>
          <?php
            while ($row = mysqli_fetch_array($query)) {?>
              <tr>
                <td><?php echo $row['id'];?></td>
                <td style="text-align:center"><img src="https://minotar.net/helm/<?php echo $row['username'];?>/50.png"/></td>
                <td><?php echo $row['username'];?></td>
                <td><?php echo $row['application_time'];?></td>
                <td><?php echo $row['status'];?></td>
        <td style="text-align:center"><a class="btn btn-primary" href="#<?php echo $row['id'];?>" data-toggle="modal" application-id="<?php echo $row['id'];?>" data-target="#viewModal">View</a></td>
              </tr>
          <?php  } ?>
        </tbody>
      </table>
    </div>
  </div>
</div>

Thanks in advance!

Answers

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    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.

    Cheers,

    Colin

  • konsyr11konsyr11 Posts: 6Questions: 1Answers: 0
    edited May 2020

    Hello, I have linked to a test case in the original post, but I just realized I made a typo in the link and it points to a 404...
    The link is https://acmeplugins.cf/demo/masswhitelist/panel/all_apps.php

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    I'm guessing this loads your Datatables initialization JS code:

    <!-- Page level custom scripts -->
      <script src="js/demo/datatables-demo.js"></script>
    

    That page is not loading. You will need to look at the server to determine why its not loading.

    Kevin

  • konsyr11konsyr11 Posts: 6Questions: 1Answers: 0

    Thanks for replying, that file was missing for some reason, it somehow got lost through the versions. Now it is back there and is still not working... The link I supplied above is the demo page which runs on a hosting service. As it worked in the past, I don't believe it's an issue with the actual server. I also have a development LAMP stack locally, on which it doesn't work either. Any ideas?

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    Your demo app still seems to be reporting a 404 error for js/demo/datatables-demo.js. Does this file contain your Datatables initialization code?

    If not then please point us to were the initialization script resides.

    Kevin

  • konsyr11konsyr11 Posts: 6Questions: 1Answers: 0

    The file is there, you can see yourself at https://acmeplugins.cf/demo/masswhitelist/panel/js/demo/. It contains the following:

    // Call the dataTables jQuery plugin
    $(document).ready(function() {
      $('#dataTable').DataTable();
    });
    

    In my development environment the file shows up (doesn't give a 404), but it still won't work...

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    For some reason when I load your page the response to loading js/demo/datatables-demo.js is a 302 Redirect to a 404 message:

    If I click on the link I' redirected to https://infinityfree.net/errors/404/ .

    If I click on the link for this:

    <!-- Custom scripts for all pages-->
      <script src="js/sb-admin-2.min.js"></script>
    

    Which is in the same js path it opens the file. I've cleared my browser's cache to make sure. Open your page in the browser and View the Source. At the bottom of the page is this:

    <!-- Page level custom scripts -->
      <script src="js/demo/datatables-demo.js"></script>
    

    Click the link to see what result you get.

    Kevin

  • konsyr11konsyr11 Posts: 6Questions: 1Answers: 0

    I can see the problem myself, I will look into it. Let me just note that on my local server the file is there and can be opened, but the datatables are still broken.

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    Opened your example again and typed $('#dataTable').DataTable(); into the console and the Datatable initialized:

    You will need to look at your server to diagnose why the scripts aren't being loaded properly.

    Kevin

  • konsyr11konsyr11 Posts: 6Questions: 1Answers: 0

    Thank you, it appears to be working on my development server, however it still 404s on the demo page. I will contact my hosting provider for that. Your help is very much appreciated!! :)

This discussion has been closed.