Skip to content
⚡️ The jQuery plugin that brings select elements into the 21st century with intuitive multiselection, searching, and much more. Now with Bootstrap 4 support.
Branch: v1.13.0-dev
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github
dist release v1.13.8 Mar 15, 2019
docs release v1.13.8 Mar 15, 2019
js ensure checkMark is only appended once (#2232) Mar 15, 2019
less Set bootstrap-select to have width: auto when inside `.form-inline` (… Mar 13, 2019
nuget release v1.13.8 Mar 15, 2019
sass Set bootstrap-select to have width: auto when inside `.form-inline` (… Mar 13, 2019
tests update titles to reference Bootstrap version Apr 18, 2018
.eslintignore use concat to wrap files with a UMD wrapper. Create sourceMap correct… Mar 8, 2019
.gitignore Revert "remove bower" Mar 9, 2018
CHANGELOG.md
CONTRIBUTING.md move note about running documentation locally to CONTRIBUTING Mar 13, 2019
Gruntfile.js fix grunt task names Mar 13, 2019
LICENSE update year Feb 9, 2018
README.md release v1.13.8 Mar 15, 2019
bower.json fix excluded dist/js folder in bower Mar 9, 2019
composer.json update jQuery version range Apr 19, 2018
package-lock.json release v1.13.8 Mar 15, 2019
package.json release v1.13.8 Mar 15, 2019

README.md

bootstrap-select

The jQuery plugin that brings select elements into the 21st century with intuitive multiselection, searching, and much more. Now with Bootstrap 4 support.

Latest release npm NuGet CDNJS jsDelivr
License peerDependencies Status devDependency Status

bootstrap-select demo

Demo

You can view a live demo and some examples of how to use the various options here.

Quick start

Bootstrap-select requires jQuery v1.9.1+, Bootstrap’s dropdown.js component, and Bootstrap's CSS. If you're not already using Bootstrap in your project, a precompiled version of the Bootstrap v3.3.7 minimum requirements can be downloaded here. If using bootstrap-select with Bootstrap v4+, you'll also need Popper.js. For all of Bootstrap v4's requirements, see Getting started. A precompiled version of the requirements will be made available in an upcoming release of bootstrap-select.

Several quick start options are available:

  • Download the latest release.
  • Clone the repo: git clone https://github.com/snapappointments/bootstrap-select.git
  • Install with npm: npm install bootstrap-select
  • Install with yarn: yarn add bootstrap-select
  • Install with Composer: composer require snapappointments/bootstrap-select
  • Install with NuGet: Install-Package bootstrap-select
  • Install with Bower: bower install bootstrap-select
  • Install via CDN (cdnjs or jsDelivr):
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.8/dist/css/bootstrap-select.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.8/dist/js/bootstrap-select.min.js"></script>

<!-- (Optional) Latest compiled and minified JavaScript translation files -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.8/dist/js/i18n/defaults-*.min.js"></script>

The CDN is updated after the release is made public, which means that there is a delay between the publishing of a release and its availability on the CDN.

Usage

Bootstrap 4 only works with bootstrap-select v1.13.0+. By default, bootstrap-select automatically detects the version of Bootstrap being used. However, there are some instances where the version detection won't work. See the documentation for more information.

Via selectpicker class

Add the selectpicker class to your select elements to auto-initialize bootstrap-select.

<select class="selectpicker">
  <option>Mustard</option>
  <option>Ketchup</option>
  <option>Barbecue</option>
</select>

Via JavaScript

// To style only selects with the my-select class
$('.my-select').selectpicker();

or

// To style all selects
$('select').selectpicker();

If calling bootstrap-select via JavaScript, you will need to wrap your code in a .ready() block or place it at the bottom of the page (after the last instance of bootstrap-select).

$(function () {
	$('select').selectpicker();
});

Check out the documentation for further information.

Bugs and feature requests

Anyone and everyone is welcome to contribute. Please take a moment to review the guidelines for contributing. Make sure you're using the latest version of bootstrap-select before submitting an issue.

Documentation

Bootstrap-select's documentation, included in this repo in the root directory, is built with MkDocs and hosted at https://developer.snapappointments.com/bootstrap-select. The documentation may also be run locally.

Copyright and license

Copyright (C) 2012-2018 SnapAppointments, LLC

Licensed under the MIT license.

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.