Bootstrap multiselect dropdown is not visible

Neha picture Neha · Jun 1, 2015 · Viewed 36.1k times · Source

Despite the fact that I can make this bootstrap-multiselect work in independent file, I'm not able to see the dropdown list once I click on caret, even if I included it in portal files.

I have already used bootstrap-datepicker, datetimepicker, chosen, and backbone.js

This is the line which is supposed to do the trick

$('.insightList').multiselect({
            selectAllText: true
});

Does anyone have an idea of what can be the cause for not adding class 'open' for 'btn-group'?

![On click also there is only btn-group class for div whether it should add open class][1] Thanks in advance

Answer

julien bouteloup picture julien bouteloup · Jun 1, 2015

I've just created a jsbin to solve your problem Working demo.

enter image description here

    <!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type="text/css" />
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>

<script type="text/javascript" src="http://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" type="text/css"/>

  <meta charset="utf-8">
  <title>Example by @Bneiluj</title>
</head>
<body>

  <select id="insightList" multiple="multiple">
    <optgroup label="Group 1">
      <option value="1-1">Option 1.1</option>
      <option value="2-1">Option 2.1</option>
      <option value="2-2">Option 2.2</option>
      <option value="2-3">Option 2.3</option>
    </optgroup>
  </select>

<script id="example">
$('#insightList').multiselect({
  enableClickableOptGroups: true
});
</script>

Please, let me know if you have any question.