Colvis is broken in latest release

rf1234

I am using the very latest releases of all components of Data Tables and Editor and Bootstrap 3.

As you can see here colvis is broken now:
https://datatables.net/extensions/buttons/examples/styling/bootstrap.html

tangerine

ColVis has been retired.
https://datatables.net/extensions/colvis/

rf1234

Now I am really confused. I am not using an extension named "colvis" but a button named "colvis" - and that is what the example uses as well if you take a look at the code of the example. (Until now I had not been aware that an extension named "colvis" had existed in older releases...).

This button is now broken: Not toggling any longer, no background color if you click on it.

allan

Now I am really confused. I am not using an extension named "colvis" but a button named "colvis"

This is probably poor naming on my part. The is a set of column visibility buttons for Buttons which is often referred to as ColVis (which also happens to be the name of the legacy extension that tangerine was referring to).

Regarding the Bootstrap 3 issue - unfortunately this issue was introduced in the 1.6.0 release. Fix was quickly committed here.

I'm going to push the fix out as a new release next week.

Allan

tangerine

Sorry, @rtf1234. I should have read the code more thoroughly.

rf1234

no worries, @tangerine. I am happy about anyone who is trying to help. And you have helped me and others many times! Thanks again for your support!

tangerine

Thanks for that!

bchipre

I'm also using, almost the latest releases of all components of Data Tables and Bootstrap 4 along with nightly builds.
I have added an external drop-down option for using the inbuilt buttons options available in Datatables.

Here is the test case for an Bootstrap Colvis issue : http://live.datatables.net/ficotimi/1/edit

Print and ColVis never works when we use Bootstrap 4. Unable to debug which version introduced the issue. Any help appreciated.

If I use the below components Colvis works perfectly.
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> <script src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script> <script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script> <script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script> <script src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script> <link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" /> <link href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css" rel="stylesheet" /> <script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.colVis.min.js"></script> <script src="https://cdn.datatables.net/buttons/1.6.0/js/buttons.print.min.js"></script>

colin

Hi @bchipre ,

Yep, I can see that, thanks for the test case. I've raised it internally (DD-1196 for my reference) and we'll report back here when there's an update.

Cheers,

Colin

rf1234

@colin, the new release @allan mentioned above: Will that be available on the download page as well? I would like to download the entire stack at once.
https://datatables.net/download/

colin

Hi @rf1234 ,

Yep, it will be when released - it hasn't happened yet but we'll update this thread when it does.

Cheers,

Colin

allan

@bchipre - Thanks for the test case! The primary issue is that for accessibility we've moved the inserted collection element next to the button that activated it. That's a problem in your case since you've got the buttons container element hidden - so the collection is also hidden!

So rather than using $().hide() use $().detach(). That will allow Buttons to see that the container isn't in the document and just inject it in.

Another thing that was messing up the styling was that you had both the Buttons base styling (v1.2.4) being loaded as well as the Buttons BootStrap styling. Only ever load one of the styling libraries.

http://live.datatables.net/jayihesi/1/edit

Allan

bchipre

Thanks @allan & @colin.
That worked like a charm when you suggested to use $().detach(). Yes, I was suppose to use only Buttons BootStrap styling. Looking forward for the entire package release.

allan

Does the print work in your environment with that change as well? It immediately closes the print window on the live site, but I think that is due to sandboxing in the live environment.

Allan

rf1234

Hi @rf1234 ,
Yep, it will be when released - it hasn't happened yet but we'll update this thread when it does.
Cheers,
Colin

I installed the new version jointly with the latest Editor version and all other updated modules this morning. Works fine now! Thanks!