Simple bootstrap-select not working

<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="bootstrap-select.min.css"> </head> <body> <select class="selectpicker"> <option>Choose</option> <option>1</option> <option>1</option> </select> http://jquery-3.3.1.min.js http://bootstrap-select.min.js $(document).ready(function(){ $('.selectpicker').selectpicker(); }); </body> </html>

I have this code.
I'm using jquery 3.3.1
I used bootstrap-select from https://github.com/silviomoreto/bootstrap-select and copy it to my local to save some load time.
But when I tried to run this, I got this result:

Bootstrap-select .selectpicker not working

Did I do thing wrong?
I've tried searching for answer, but can't seem to found any working answer. Thanks.

NB: I tried using Chrome and Firefox, both gave me the same result.

Did you forget to add bootstrap.css?
– StaticBeagle
Jul 3 at 1:07

bootstrap.css

Do I need to add bootstrap to use bootstrap-select? Sorry, I'm new here at bootstrap-select.
– Michael Harley
Jul 3 at 1:10

@StaticBeagle Oh yeah, I need to use bootstrap to use bootstrap-select. Thanks a lot. :) (Just now I tried it)
– Michael Harley
Jul 3 at 1:15

You bet. Glad I could help!
– StaticBeagle
Jul 3 at 1:20

3 Answers
3

The dependencies section of this link has your answer.

For this to work, you needs :

If you don't have bootstrap in your project, you can add the minified version and customize it for your needs and recompile it.

PS Don't use the bootstrap version 4 because it will probably not work.

Hope it helps !

Looks like you need to include Bootstrap’s dropdown.js component, and Bootstrap's CSS. Only then you can use bootstrap-select. Info is here at the very top http://silviomoreto.github.io/bootstrap-select/.

bootstrap-select

Take a look at this fiddle https://jsfiddle.net/sairam0903/x9bm7qs8/2/

try this hope it helps :)

$(document).ready(function(e) { $('.selectpicker').selectpicker(); });

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

搜尋此網誌

Fjhtyj