CODEWITHSUNDEEP
javascriptjquerytwitter-bootstrap
Apprentice Programmer
Apprentice Programmer

Reputation: 1515

Selecting list element from bootstrap dropdown, showing selected element

I have no idea how to write the javascript code for this, can someone help me please?

 <div class="input-group">
  <div class="input-group-btn">
   <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Select one <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">Entrepreneurship</a></li>
      <li><a href="#">Investments</a></li>
      <li><a href="#">Management</a></li>
      <li class="divider"></li>
      <li><a href="#">All of the Above</a></li>
    </ul>
  </div><!-- /btn-group -->
  <input type="text" class="form-control" placeholder ="Years of experience" >
 </div>
</p>

Upvotes: 0

Views: 64

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388416

You can have a click handler to the li elements like

jQuery(function ($) {
    $('.input-group-btn .dropdown-menu > li:not(.divider)').click(function(){
        $(this).closest('ul').prev().text($(this).text())
    })
});

Demo: Fiddle

Upvotes: 1

Related Questions