Skip to content

A simple jQuery plugin that extends bootstrap's dropdown menu into something like github's select menu.

License

Notifications You must be signed in to change notification settings

lodev09/bootstrap-dropselect

Repository files navigation

bootstrap-dropselect

A simple jQuery plugin that extends bootstrap's dropdown menu into a select menu

demo

Install

Several quick start options are available:

  • download latest release
  • npm: npm install --save bootstrap-dropselect
  • bower: bower install bootstrap-dropselect

** Make sure to link bootstrap-dropselect.js and bootstrap-dropselect.css to your project

Usage

Setup dropselect in 2 steps

Step 1

Just code your standard bootstrap dropdown. http://getbootstrap.com/components/#dropdowns

<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul id="dropselect-demo1" class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul>
</div>

Step 2

Now get the ul DOM and run dropselect

$(function() {
  $('#dropselect-demo1').dropselect();
})

API

http://lodev09.github.io/bootstrap-dropselect/#api

Credits

All bugs, feature requests, pull requests, feedback, etc., are welcome!

Bootstrap Components, Github's Select Menu

License

Released under the Apache License, Version 2.0. See LICENSE file.

Copyright 2014, Jovanni Lo / @lodev09 / www.lodev09.com / lodev09@gmail.com