Multiple DataTables in one page with differents parameters

Question

I have two dataTables on the same page, like this example: https://datatables.net/examples/basic_init/multiple_tables.html

Until no problem ..

It shares many parameters in common, for example for buttons or language

$('table').DataTable({
  language: {
    search: "",
    searchPlaceholder: "Search ...",
    sLengthMenu:"_MENU_",
    sInfo:"_TOTAL_ elmt",
    infoFiltered: "",
    sInfoEmpty: "0 elmt",
    "oPaginate": {
      "sPrevious": "<",
      "sNext": ">"
    }
  }
});

However, I wish to give them different pageLength sizes and different tries, How can I do ?

Knowing that the ID of the first table is table-one and the ID of the second is table-two

Why don't you just do $('#table-one').DataTable() and $('#table-two').DataTable() and give everyone it's own params? — Alexandre Elshobokshy
– Alexandre Elshobokshy, Commented Jan 4, 2019 at 11:14
@IslamElshobokshy Because there is more parameter in common than of different parameter, so I wanted to avoid the redundancy of the code — Rocstar
– Rocstar, Commented Jan 4, 2019 at 11:20
If there is even 1 different parameter then you need to duplicate all of the code, there's no going through that unfortunately. — Alexandre Elshobokshy
– Alexandre Elshobokshy, Commented Jan 4, 2019 at 11:20

Wesley Smith · Accepted Answer · 2019-01-04 14:43:24Z

2

Do this:

// create an object with your settings for the first table
var dataTableOptions = {
  language: {
    search: "",
    searchPlaceholder: "Search ...",
    sLengthMenu:"_MENU_",
    sInfo:"_TOTAL_ elmt",
    infoFiltered: "",
    sInfoEmpty: "0 elmt",
    "oPaginate": {
      "sPrevious": "<",
      "sNext": ">"
    }
  }
};

// initialize that table
$('#table1').DataTable(dataTableOptions);

// modify whatever settings you need to in the object you created
dataTableOptions.language.sLengthMenu = "some new value";

// use the modified object to initialize the second table
$('#table2').DataTable(dataTableOptions);

edited Jan 4, 2019 at 14:43

answered Jan 4, 2019 at 14:22

Wesley Smith

19.6k22 gold badges93 silver badges135 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Dani Over a year ago

This is only for translation, how do you set diferent length pages?

Wesley Smith Over a year ago

@Dani you should read the comments "// modify whatever settings you need to in the object you created" the given property was simply an example. You can change any property thats needed

Dani Over a year ago

Yeah i understand know, i was thinking in json traslations of datatable... Sorry and good answer

Collectives™ on Stack Overflow

Multiple DataTables in one page with differents parameters

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related