MDB Pro v4 glitches with Jquery Datatables

MDB SupportCategory: General Bootstrap questionsMDB Pro v4 glitches with Jquery Datatables
joshusre Pro User asked 10 months ago in MDB pro, version:4

Hi,

I’m using jquery datatables in a project with my mdb templates and I’m having trouble.   The material select drop down prevent the default datatable drop downs from showing and when you add mdb-select to try and fix (including initializing it) you get a mdb drop down but its buggy (stays open after selecting an option).

Is there a possibility that this will be fixed?

Alternatively, is there a way to keep MDB from adjusting my select objects?

Thanks for your help.

hello@canberranet.com.au Pro User replied 7 months ago

it happens to your demo page:
https://mdbootstrap.com/content/tables/#sorting

After clicking an entry in the show entries drop down, the dropdown closes, but then opens again.

I too would like a fix for this.

Shane West replied 7 months ago

Has anyone found a fix for this?
If you still need a demo this happens in Chrome (56.0.2924.87) on your demo page:
https://mdbootstrap.com/content/tables/#sorting
Here's a gif of the behavior:
https://imgur.com/CeWSvtp

joshusre Pro User replied 10 months ago

I’ll have this posted soon. Thank you for your patience.

Bartłomiej Malanowski Pro UserPremium replied 10 months ago

yes, MDB Free is available via CDN: https://cdnjs.com/libraries/mdbootstrap

joshusre Pro User replied 10 months ago

Are mdb.css / mdb.js accessible via CDN? Or, is there a third party site you know of that would let me upload mdb.css / js and allow me to fulfill your request? Would GIF suffice?

Bartłomiej Malanowski Pro UserPremium replied 10 months ago

Please show us live demo

4 Answers
Jakub Strebeyko answered 7 months ago

Hi guys,

First of all – thank you all for taking your time and noticing us about this. Unfortunately, this bug has no fix available instantly. The team will try to solve the problem in the nearest future.

Regards,

Jake

Jakub Strebeyko replied 7 months ago

I am sorry to hear that. We will do our best to "de-inforce" it back, though, so be sure to check out our updates.
Cheers!

joshusre Pro User replied 7 months ago

I always wondered if buying this template was a poor choice on my part. This kind of stuff re-enforces my opinion that it was.

Steffen Otto Jensen Pro User answered 5 months ago

Is there any news on this issue

Thanks,

Steffen

Jakub Strebeyko answered 4 months ago

Hi there everyone!

I have good news – couple of them, actually. First of, the material select has been improved and so it should cause trouble in data-tables no more. Please update your package to the newest version (4.4.5) for it to reflect the recent developments. That’s not all; we actually went further and decided to lean towards flexible development and custom packaging of MDB-based projects. It means that now you can hand-pick MDB utilities that you really need, leaving out the rest, greatly reducing package size. Please refer to out offcial Bootstrap Gulp tutorial. This should be especially helpful when your local environment and/or tools conflict with their MDB counterparts, as seemed to be the case here.

With Best Regards,
Kuba

ramix Pro User answered 3 months ago

I dont see how this is solved, even in the example on this site this problem still accurs

Jakub Strebeyko replied 1 day ago

Thanks for taking time and sharing the hotfix! Surely it will help people out there.

Pro User replied 2 days ago

This worked for me:

// Bugfix for re-opening of pagelength-dropdown
$(‘.dataTables_length select’).change(function () {
$(this).material_select(‘destroy’);
$(this).unbind(‘click’).click(function () {
$(this).material_select();
});
});

Jakub Strebeyko replied 3 months ago

Hi, which example do you mean?