Datable not working in JQuerry 4.7.5

web
mobile

Topic: Datable not working in JQuerry 4.7.5

Doc asked a year ago

I have made a page with a datatable, and initialized it with a custom init JS so that it is localised (texts for searc, pagination and such are in french). It works perfectly all right with 4.7.4.

I installed 4.7.5, I copy pasted this page in this new version without changing anything and it doesn't work anymore : there's no "search", no pagination, no checkboxes, no icons to order the columns : it's as if the page cannot find the addons anymore.

I have checked that the datatable and datatable_select are on the correct folders under css/addons and js/addons.

Of course, the page refers to these addons with the correct path.

Since I use the gulp version, I also checked that the mdb.scss and modules.js files do load the datatables and datatables_select options.

So, what's going on ?


buzzman commented a year ago

This is what I am also experiencing. I just joined so I felt I maybe was doing something wrong. But this is exactly my issue.


Piotr Glejzer staff answered a year ago

Hello,
it's weird because we didn't change anything with DataTable code js or CSS with the latest release so I have no idea it's not working. Are you sure there are everything correct? I checked the latest package version form our server and everything is working well.
Best,
Piotr


Doc answered a year ago

I just made the test.

I unzipped the MDB-Extended_4.7.5.zip file. I replaced the "style.css" file with my own I added my custom js.file I checked that the datatable-select files were in the addons subfolders of the css and js folders I copy pasted my html page (which works perfectly well under 4.7.4), and I got the same results as explained above : no "search", no pagination, etc...

I can send you my files if you want to check them, if you want (please give me an e-mail to do so, or send me a mail through my account.


Piotr Glejzer staff commented a year ago

Sure, you can send me your files, I will check it.
Here is an email address :
p.glejzer@mdbootstrap.com


Doc commented a year ago

The problem is still there with version 4.7.6. Did you find the reason why ?


Piotr Glejzer staff commented a year ago

We didn't change anything with DataTable since we added a checkbox extension. I have no idea why this is not working with your project because of our defaults examples works irreproachable.


Doc commented a year ago

You did change something and I can tell you what it is, because I found the problem :

In 4.7.4, the mdb.css file, line 8520 to 8798, contains code for MDBootstrap integration with Datatables. These are missing in the 4.7.6 mdb.css file.

Similarly, in 4.7.4 mdb.js file, lines 26826 to 42323 contain code for MDBootstrap integration with Datatables. These are missing in the 4.7.6 mdb.js file.

These missing lines are what are causing the problem. If I copy them from the 4.7.4 version and I add them to the 4.7.6 version, everything works smoothly.

Hope this helps.


Piotr Glejzer staff answered a year ago

We don't contain CSS and JS code of DataTable in mdb.css and mdb.js ( even in minified version ) by default. If it has been there it was our mistake.
If you would like to work with data table you have to add extra paths to CSS and JS which contains data table code. Like that :

  <link rel="stylesheet" href="css/addons/datatables.css">
  <script src="js/addons/datatables.js"></script>

or you can use datatable.scss in scss/addons and js/modules.js where you can uncomment path to datatable.js and it will be compiled to mdb.js. ( I'm talking about GULP version where you have to compiled/minified on your own )


buzzman commented a year ago

I found the issue... Your website snippet says : css/addons/datatables.js and it should be js/addons/datatables.js It should read js instead of css... for the javascript folder reference.


Piotr Glejzer staff commented a year ago

Thanks for the reported issue. I fixed this! Regards!


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: jQuery
  • MDB Version: 4.7.5
  • Device: PC
  • Browser: Firefox
  • OS: Windows10 x64
  • Provided sample code: No
  • Provided link: No
Tags