Bootstrap-select: Click on dropdown button, no list of options opens

[daN4cat]

Connected to #1306 (the posting after it was closed), I've the same issue.
If I click on the dropdown button no list of options opens.

Checking with Chrome Inspector I can see that <div class="btn-group bootstrap-select show-menu-arrow fit-width"> is "refreshed" on click but no open is added.
If I manually add the open the drop down option list opens, that's what happens on your example page.

I use 1.10.0, js & css. I use a bootswatch flatly bootstrap 3 css theme and js.

I do not really understand what's wrong, here the html from the rendered page:

<form action="<..url..>/change_mode" id="mode_form" method="post" accept-charset="utf-8">
    <label id="mode_label">Register Mode</label>
    <div class="btn-group bootstrap-select show-menu-arrow fit-width">
        <button type="button" class="btn dropdown-toggle btn-info btn-sm" data-toggle="dropdown" title="Sale" aria-expanded="false">
            <span class="filter-option pull-left">Sale</span>
            &nbsp;
            <span class="bs-caret"><span class="caret"></span></span>
        </button>
        <div class="dropdown-menu open" style="max-height: 548px; overflow: hidden; min-height: 0px;">
        <ul class="dropdown-menu inner" role="menu" style="max-height: 536px; overflow-y: auto; min-height: 0px;">
            <li data-original-index="0" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Sale</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li>
            <li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Return</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li>
        </ul>
        </div>
        <select name="mode" onchange="$('#mode_form').submit();" class="selectpicker show-menu-arrow" data-style="btn-info btn-sm" data-width="fit" tabindex="-98">
            <option value="sale" selected="selected">Sale</option>
            <option value="return">Return</option>
        </select>
    </div>
</form>

[daN4cat]

As additional note, I use smalot-bootstrap-datetimepicker and jasny-bootstrap widgets and there are no issues. They work fine.

[caseyjhol]

See guidelines for contributing.

Bug reports

A bug is a _demonstrable problem_ that is caused by the code in the repository.
Good bug reports are extremely helpful - thank you!

Guidelines for bug reports:

1. Use the GitHub issue search. Check if the issue has already been reported.
2. Check if the issue has been fixed. Try to reproduce it using the latest master or development branch in the repository.
3. Provide environment details. Provide your operating system, browser(s), jQuery version, Bootstrap version, and bootstrap-select version.
4. Create an isolated and reproducible test case. Create a reduced test case.
5. Include a live example. Make use of jsFiddle or jsBin to share your isolated test cases.

[daN4cat]

1. I don't seem to find any other issue than the one referenced already (where I don't see any solution)
2. I used the latest master
3. OS: Windows 7, Browser: Google Chrome (latest), jQuery: 1.12.1, jQueryUI: 1.11.4, bootswatch-dist: 3.3.6-flatly, bootstrap-select:1.10.0 (with latest master as of today). There is jquery-mgrate 1.3.0 still active because I need to sort out two other plug-in replacement (worth flagging this in case makes a difference)
4. & 5. I'll see if I'm able to reproduce something and post here a link.

[daN4cat]

Here the issue on jsFiddle: https://jsfiddle.net/FrancescoUK/3gpfmh31/

[daN4cat]

jsFiddle is really messy... it's difficult to understand when something is saved or not.

The above latest link should be fine and showing the issue.

In the css part I have only bootswatch.css and bootstrap-select.css, HTML is the example I have in the code, js is the full js we use in the opersourcepos code that we are migrating to bootstrap.

The conflict must be in the js but I can't really figure out what exactly.

[daN4cat]

I think I found the culprit, it's the bower & grunt scripting in opensourcepos that is pulling in two versions of boostrap.js in the global opesourcepos.js.

In case somebody faces a similar issues, please check that you don't double include by mistake boostrap.js when using a distribution.

I close this issue.

[Mr-Newlove]

I know this is closed, but thanks for posted this, was having the same issue, loaded bootstrap, then datatables, but datatables was loading bootstrap as well, then I loaded bootstrap-select and it killed things.

[erensogut]

Closed but help me a lot.It works like a miracle.Thx

[PisaJan]

Thanks for this post it helped a lot!