bootstrap-select: options not appearing in dropdown

Question

I'm using ASP.net MVC with bootstrap. I have two dropdown lists that I use bootstrap-select on to match the theme. The problem is that if I click the dropdown list, it doesn't show its content. However, if I press the down (or up) key when it's focused it will display the contents of the dropdown list.

Razor:

<div class="form-group">
    @Html.LabelFor(m => m.Profession, new { @class = "col-md-2 control-label" })
    <div class="col-md-10">
        @Html.DropDownListFor(m => m.Profession, new SelectList(Enum.GetValues(typeof(Profession))),
                "Select Profession", new { @class = "selectpicker" })
    </div>
</div>

Javascript:

<script type="text/javascript">
    $(document).ready(function () {
    $('select').selectpicker();
    });
</script>`

Any ideas? I've been stuck on this too long :-)

Can you post the code for selectpicker()?!

IndieTech Solutions
– IndieTech Solutions

2015-12-21 00:59:42 +00:00
Commented Dec 21, 2015 at 0:59 — IndieTech Solutions
– IndieTech Solutions, Commented Dec 21, 2015 at 0:59

kevindeleon · Accepted Answer · 2015-12-21 04:18:31Z

1

If I understand the bootstrap-select documentation correctly, you really only need to add the class selectpicker to your dropdown. You probably don't need the document ready statement at all. Just remove that entire script block and see if that fixes it...you may be initializing it twice and hosing things up.

The other option is to remove the class and leave the document ready declaration.

answered Dec 21, 2015 at 4:18

kevindeleon

1,9243 gold badges18 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

bootstrap-select: options not appearing in dropdown

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related