ColReorder documentation and Bootstrap 4 styling js files to include

Lolo

In documentation for ColReorder extension and Bootstrap 4 styling (see https://datatables.net/extensions/colreorder/examples/styling/bootstrap4.html) it is written that we have to use these js files:

https://code.jquery.com/jquery-3.5.1.js
https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js
https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js
https://cdn.datatables.net/colreorder/1.5.2/js/dataTables.colReorder.min.js

My question is the following:
Do we have to also include the file colReorder.bootstrap4.min.js from colreorder/1.5.2/js/ folder?

Thanks in advance and have a nice day.

kthorngren

Click on the CSS tab to see the CSS files needed, from the example you linked:

https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css
https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css
https://cdn.datatables.net/colreorder/1.5.2/css/colReorder.bootstrap4.min.css

You can use the Download Builder to get the proper set of files.

Kevin

Lolo

Hi kthorngren,

Thanks for your answer.

I already know that for CSS tab and as you can see below, the specific css file for Bootstrap is used.

https://cdn.datatables.net/colreorder/1.5.2/css/colReorder.bootstrap4.min.css

So my question is on the specific JS file for Bootstrap 4

<script type="text/javascript" src="DataTables-1.10.21/js/dataTables.bootstrap4.min.js"></script>

Is it just a small mistake on the documentation and I have to include it or not?
Otherwise, what is the aim of this file?

colin

Nope, not a mistake, and yep, you do need it. It's the code specific for the BS4 styling.

Colin

kthorngren

The Bootstrap 4 Styling docs explains what is needed.

Kevin

Lolo

So if I understand what you told me and what is written in the documentation:

Both of these Javascript files should be included - the main file to include the basic DataTables functionality and the styling file to set defaults as appropriate for the styling library.

We should have this like files to include:

https://code.jquery.com/jquery-3.5.1.js
https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js
https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js
https://cdn.datatables.net/colreorder/1.5.2/js/dataTables.colReorder.min.js
https://cdn.datatables.net/colreorder/1.5.2/js/colReorder.bootstrap4.min.js

colReorder.bootstrap4.min.js file is missing isn't it?

Lolo

For example if I take the "Buttons" extension, there is 4 files to include in the styling example.

https://code.jquery.com/jquery-3.5.1.js
https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js
https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js
https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js
https://cdn.datatables.net/buttons/1.6.2/js/buttons.bootstrap4.min.js
...

So I suppose it should be the same for "colReorder", "Select", ... extensions.

Thanks in advanced for your answer.

kthorngren

The BS4 Styling doc I linked to states this:

Please note that not all extensions require Javascript and / or CSS for the styling libraries. If the styling libraries are not present in the repo or package, then they are not required.

Kevin

Lolo

You are right, it is written.
So, if the file exists in the folder extension, I have to include it or I am wrong?

It is just for my understanding.
And if there is a little oversight in the documentation, then the author will be able to correct it.

kthorngren

So, if the file exists in the folder extension, I have to include it or I am wrong?

Yes you should include the additional styling files. If you don't then minimally the styling for that component may not follow with the styling framework. You could also find that the UI will have more obvious display issues like elements not being aligned properly, etc.

EDIT: You can use the Download Builder to generate the proper set of files for your solution.

Kevin

Lolo

Thanks a lot for your answer.

In fact, I have already included the styling javascript file but I would like to be sure to do things like they should be.

So, in the future it would be nice to update the documentation in order to be correct.

Thanks again and have a nice day.

kthorngren

So, in the future it would be nice to update the documentation in order to be correct.

Please post the link and specifics of what documentation needs updating The developers will update it if appropriate.

Kevin