DataTables
Advanced interaction
features for your tables.
Editor
Comprehensive editing
library for DataTables.
Manual
Download
≡ Show site navigation

Need help implementing on a simple php/json site

Need help implementing on a simple php/json site

eduardopatoeduardopato Posts: 6Questions: 2Answers: 0
in Free community support

Hi, guys!

I decided to create a simple site to help my players on a D&D game. I'm using PHP (so I can pratice it since I'm starting to learn) and bootstrap. On the "spells" page i decided to use a table and get the data from a json (i know nothing about databases so i decided to use it instead) that I created but theres soooo much itens that I want to use this plugin to filter, add pagination and use the search input.

I tried to implement DataTables using the documentation here for 2 days but I'm really struggling. So here's my question: Is there a way to use DataTables with what I have right now? What do I need to change to make this work?

My table (php):

My json file:

My output:

Link to test case: https://5esrd.azurewebsites.net/lista-de-magias.php

Ps.: thank you for putting up with my terrible english/php writing abilities.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,516Questions: 1Answers: 10,472 Site admin
    Answer ✓

    Looks like you are trying to initialise the DataTable too early. Move

    <script>
    $(document).ready(function() {
        $('#table-lista-de-magias').DataTable();
    } );
</script>

    To the end of your <head></head>.

    Also your table HTML isn't valid:

    <table id="table-lista-de-magias" ...><tr><thead><th scope="col">Círculo</th>

    The tr should be inside the thead.

    The W3C validator is great for making sure your HTML is valid. DataTables assumes valid HTML.

    Allan

  • eduardopatoeduardopato Posts: 6Questions: 2Answers: 0

    Allan, thank you so much!

    Now it just works! And was such a simple oversight haha
    Seriously, thank you for your time and for the W3C Validator. Had no idea it existed and already found a few errors there.

    Cheers!

This discussion has been closed.

DataTables

DataTables designed and created by SpryMedia Ltd.
© 2007-2023 MIT licensed. Privacy policy. Supporters.
SpryMedia Ltd is registered in Scotland, company no. SC456502.