CODEWITHSUNDEEP
javascriptphpdatatablesbootstrap-4
Rafael Breno
Rafael Breno

Reputation: 11

How to put multiple dataTables in one page?

Hello I'm in the middle of a Intranet development and i'm using DataTable in 4 different tables but just one works well, how can i change this situation?

PHP Page(Have some words in Portuguese):

https://pastebin.com/xutdL6bc

And this is the JavaScript file

$(document).ready(function() {
    $('#example').dataTable();
} );

If i change the class of the table the "beauty" will not work

Upvotes: 0

Views: 2130

Answers (1)

sam
sam

Reputation: 2984

UPDATE

I have looked up the API and I found the documentation that discusses having two tables. They achieve this based on the class of those tables. So in your case it would be table.beauty:

$(document).ready(function() {
    $('table.beauty').DataTable();
} );

Then get the table with the needed class:

<table id="" class="beauty" cellspacing="0" width="100%">

For more documentation look under their docs. It has all the information on there that you will need to get started with the code.

No, it would not, because in your current code changing the class will do absolutely nothing since you are calling the element by its id (#example). You are calling the jQuery element by ID value: #example. In practice you would have to change the JavaScript if you want the code to be applied by class.

// only the element with the id of example
$(document).ready(function() {
    $('#example').dataTable();
} );

If you want to get based on class change the # to a .. That would look like:

// any element with the class of example
$(document).ready(function() {
    $('.example').dataTable();
} );

NOTE: Your code is using mysql functions which are depricated, I know you were not asking about that; but if you are learning PHP I recommend you learn to use Mysqli or PDO would be far more beneficial.

Upvotes: 2

Related Questions