Bootstrap Scrollable Menu类无法正常工作

Question

我为下拉列表（菜单）添加了一个bootstrap类，但是，菜单没有下拉以显示菜单中的可用选项。我已经尝试了几个引导类甚至不可滚动的菜单，但仍然是同样的问题。我确实需要保持每个菜单的响应和所有水平对齐，因此我用于row和col类。

  <div id="outerPanel" class="panel panel-default" style="width: 100%;">    
    <div class="panel-body" >
      <div class="row" >
        <!-- <div class="panel-body"> -->
            <div class="col-sm-3">
              <div class="input-group">
               <input type="text" class="form-control" placeholder="Search">
                          <span class="input-group-btn">
                            <button id="search-btn" class="btn btn-default" type="button"><span class="glyphicon glyphicon-search"></span></button>
                          </span>
                        </div>
                        <!-- /input-group -->
                      </div>
                </div>
                <div id="adv-row" class="row"> 
                    <div class="col-sm-4" style="padding-left:0px;">
                      <div style="float:left; padding-left:10px;padding-right:10px;">Search by</div>    
                        <div class="btn-group">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Scrollable Menu <span class="caret"></span></button>
                            <ul class="dropdown-menu scrollable-menu" role="menu">
                                <li><a href="#">Action</a></li>
                                <li><a href="#">Another action</a></li>
                                <li><a href="#">Something else here</a></li>
                                <li><a href="#">Action</a></li>
                                <li><a href="#">Another action</a></li>
                            </ul>
                        </div>
                    </div>
            <div class="btn-group">
              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Scrollable Menu <span class="caret"></span></button>
              <ul class="dropdown-menu scrollable-menu" role="menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
              </ul>
            </div>
                    <!-- </div> -->
                </div>

Here is the code