fefe
fefe

Reputation: 9065

bootstrap3 dropdown appended as select option

is there a way to use dropdown appended in bootstrap as select option.

what I mean I have the following

    <div class="input-group">
         <input type="text" class="form-control">
             <div class="input-group-btn">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Options <span class="caret"></span></button>
                   <ul class="dropdown-menu pull-right">
                       <li><a href="#">Option1</a></li>
                       <li><a href="#">Options2</a></li>
                   </ul>
             </div>
    </div>

and I would like to have as

<div class="input-group">
    <input type="text" class="form-control">
         <div class="input-group-btn">
         <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">test <span class="caret"></span></button>
           <select class="dropdown-menu pull-right">
                  <option>option1</option>
                  <option>option2</option>
           </select>
         </div><!-- /btn-group -->
 </div>

Upvotes: 0

Views: 598

Answers (1)

Christina
Christina

Reputation: 34642

Per the docs of Bootstrap 3, they don't support select within input groups:

https://github.com/twbs/bootstrap/issues/11340

enter image description here

You can TRY playing around with this, but at a cursory look it probably won't work unless you write your own css or modify the script or both.

DEMO: http://silviomoreto.github.io/bootstrap-select/3/

https://github.com/silviomoreto/bootstrap-select

It styles selects to look like a dropdown menu in BS3.

Upvotes: 1

Related Questions