Bootstrap Mulitselect - Inside Accordion

by Kyle Mitofsky

HTML

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/css/bootstrap-multiselect.css">
<script src="http://davidstutz.github.io/bootstrap-multiselect/js/bootstrap-multiselect.js"></script>
<div class="panel-group" id="accordion">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                    Collapsible Group Item #1
                </a>
            </h4>
        </div>
        <div id="collapseOne" class="panel-collapse collapse in">
            <div class="panel-body">
                <p>Category provided by the borrower for the loan request.</p>
                <select class="multiselect" multiple="multiple" name="purpose">
                    <option value="car">car</option>
                    <option value="credit card">credit card</option>
                    <option value="debt consolidation">debt consolidation</option>
                    <option value="educational">educational</option>
                    <option value="home improvement">home improvement</option>
                    <option value="house">house</option>
                    <option value="major purchase">major purchase</option>
                    <option value="medical">medical</option>
                    <option value="moving">moving</option>
                    <option value="other">other</option>
                    <option value="renewable energy">renewable energy</option>
                    <option value="small business">small business</option>
                    <option value="vacation">vacation</option>
                    <option value="wedding">wedding</option>
                </select>
            </div>
      ...

CSS

.panel-group .panel {
  overflow: visible;
}

JavaScript

$('.multiselect').multiselect();