jQuery datatables - select not working

Question

When i apply dataTables functionality on a given table and want it to be selecteable, i perform the following:

 var table = $('#table').DataTable( {
        select: true
    });

Which is working fine on the first table on the same site. However, when i try to have a second selecteable table, it just won't select on click. It shows the info message "click to select", though.

I have loaded the dataTables.select.min.js file, after loading the dataTables.js itself. (It works on the first table on the site, even without loading the dataTables.select.min.js, but i wanted to be sure..)

I also tried to apply table.select() after initialization, it does not work either.

Any ideas on why this isn't working properly?

DataTabels version is 1.10.16, select version is 1.2.3

Edit: My second table is being build on a button click, asynchronuosly via ajax call to get the data, and then using js .innerHTML to actualy build the DOM for the second table. So maybe the problem is, that i do not apply the datatables functionality for the second table on $(document).ready, as i do not have the option to do so?

Do both tables have the #table id - if so that's the problem. Use a class to select multiple elements as ids must be unique — Rory McCrossan
– Rory McCrossan, Commented Nov 21, 2017 at 11:49
They have different id's. As far as i know, the class tag is used to define dataTables options only. — Toni Latenz
– Toni Latenz, Commented Nov 21, 2017 at 11:51

Gyrocode.com · Accepted Answer · 2017-11-21 13:28:11Z

1

Either initialize your tables using class name once:

var table = $('.example').DataTable({
    select: true
});

or initialize your table separately by using ID:

var table1 = $('#example1').DataTable({
    select: true
});

var table2 = $('#example2').DataTable( {
    select: true
});

See this example for code and demonstration.

edited Nov 21, 2017 at 13:28

answered Nov 21, 2017 at 12:39

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

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

2 Comments

Toni Latenz Over a year ago

That's what i am doing. (Example 2)

Gyrocode.com Over a year ago

@ToniLatenz, see updated example, it works as expected.

Toni Latenz · Accepted Answer · 2017-11-21 13:33:43Z

1

So yeah, the problem was, i did not initialize the second table within a $(document).ready function. Doing so, solved the issue.

Thank you for your contribution.

answered Nov 21, 2017 at 13:33

Toni Latenz

2162 gold badges5 silver badges21 bronze badges

Collectives™ on Stack Overflow

jQuery datatables - select not working

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related