Colvis is broken in latest release

Colvis is broken in latest release

rf1234rf1234 Posts: 915Questions: 46Answers: 127

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

Answers

  • tangerinetangerine Posts: 2,378Questions: 18Answers: 265
  • rf1234rf1234 Posts: 915Questions: 46Answers: 127

    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.

  • allanallan Posts: 50,506Questions: 1Answers: 7,508 Site admin
    Answer ✓

    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

  • tangerinetangerine Posts: 2,378Questions: 18Answers: 265
    Answer ✓

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

  • rf1234rf1234 Posts: 915Questions: 46Answers: 127

    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!

  • tangerinetangerine Posts: 2,378Questions: 18Answers: 265
    Answer ✓

    Thanks for that!

  • bchiprebchipre Posts: 4Questions: 1Answers: 0
    edited October 9

    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>

  • colincolin Posts: 6,206Questions: 0Answers: 1,066

    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

  • rf1234rf1234 Posts: 915Questions: 46Answers: 127

    @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/

  • colincolin Posts: 6,206Questions: 0Answers: 1,066
    Answer ✓

    Hi @rf1234 ,

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

    Cheers,

    Colin

  • allanallan Posts: 50,506Questions: 1Answers: 7,508 Site admin

    @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

  • bchiprebchipre Posts: 4Questions: 1Answers: 0

    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. :)

  • allanallan Posts: 50,506Questions: 1Answers: 7,508 Site admin

    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

Sign In or Register to comment.