Bootstrap 5 / Bootstrap-select how to append to datatables column select

Bootstrap 5 / Bootstrap-select how to append to datatables column select

martin1223345martin1223345 Posts: 84Questions: 23Answers: 0

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

See above example. I am trying to append the bootstrap-select plugin to use its layout and live-search function in the th colomn. I don't get it working, it is not showing the options (they are generated in the console). What am I doing wrong?

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,322Questions: 26Answers: 4,948
    Answer ✓

    Your test case has this error:

    Uncaught TypeError: $(...).selectpicker is not a function

    You don't have the bootstrap-select.js installed. Take a look at the bootstrap-select docs for the requirements. Specifically things like this:

    If using bootstrap-select with Bootstrap v4+, you'll also need Popper.js.

    Not sure if it support Bootstrap 5.

    Kevin

  • martin1223345martin1223345 Posts: 84Questions: 23Answers: 0

    Hmm, I had that present. It will work with bootstrap 5. I use the extention in other parts of my website. After some more research I got this code working. See example, for those who want to make use of it in Bootstrap 5.

    live.datatables.net/lomevebo/1/edit

  • MaidoMaido Posts: 1Questions: 0Answers: 0

    Do you have any idea why my bootstrap-select shows but it doesn't open? Basically same configuration as you. Can't provide testcase because I'm using Angular and stackblitz,plnker etc don't support node_modules...

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    @Maido We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • martin1223345martin1223345 Posts: 84Questions: 23Answers: 0

    Check the order of which you load in the scripts. Bootstrap select should be last inline or even at the end of your page for as far as I can tell. Else there might be something wrong with your code. Basically does not mean exact the same. But I cant see that now. Perhaps a example would be good.

Sign In or Register to comment.