title: Drop Down Menu Inside Text Field Bootstrap
body: <p>I want to display my drop down menu inside my text input field using bootstrap:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(e) {
          $('.selectpicker').selectpicker();
          $('div.cow').scrollyou();
          $("select").selectBoxIt();
      });
  &lt;/script&gt;
  
  &lt;form action="#" method="post" class="form-inline"&gt;
      &lt;div class="input-append"&gt;
          &lt;input type="text" class="form-control input-lg" name="domain" size="40" value="Search"/&gt;
          &lt;select name="tld[]" class="selectpicker scrollMe" data-size="5" data-live-search="true" multiple data-selected-text-format="values" multiple title='Select Option' data-style="btn-primary" data-width="15%"&gt;
              &lt;div class="cow"&gt;
                  &lt;option&gt;One&lt;/option&gt;
                  &lt;option&gt;Two&lt;/option&gt;
                  &lt;option&gt;Three&lt;/option&gt;
                  &lt;option&gt;Four&lt;/option&gt;
                  &lt;option&gt;Five&lt;/option&gt;
                  &lt;option&gt;Six&lt;/option&gt;
              &lt;/optgroup&gt;
              &lt;/div&gt;
          &lt;/select&gt;
          &lt;button class="btn btn-lg btn-inverse" type="submit" value="Search" /&gt;
              &lt;i class="fa fa-search"&gt;&lt;/i&gt;
          &lt;/button&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you can see, I'm using Bootstrap-select and scrollYou for some of the functionality.  </p>
  
  <p>But how can I get my select field (and options) to display inside the search box?</p>
  
  <p>Any help is much appreciated!  </p>