Fork me on GitHub

Bootstrap Multiselect

Please consult the FAQ, the Issue Tracker or Stack Overflow before creating a new issue; when creating an issue or a pull request, read how to contribute first.

Consider making a donation to support the development of this plugin:

Why Donate?

Getting started with Bootstrap Multiselect and Require JS:

  1. Link the CSS Files

    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css"/>
    
  2. Include Require JS

    <script data-main="dist/js/" src="js/require.min.js"></script>
    
  3. Create a Select

    Now simply use HTML to create your select input which you want to turn into a multiselect. Remember to set the multiple attribute as to get a real multiselect - but do not worry, the plugin can also be used as usual select without the multiple attribute being present.

    <!-- Build your select: -->
    <select id="example-getting-started" multiple="multiple">
    <option value="cheese">Cheese</option>
    <option value="tomatoes">Tomatoes</option>
    <option value="mozarella">Mozzarella</option>
    <option value="mushrooms">Mushrooms</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="onions">Onions</option>
    </select>
    
  4. Call the Plugin

    In the end, simply call the plugin on your select:

    Note that in this example, jQuery is included manually due to the file structure of this documentation; however this is not necessary.

    <!-- Initialize the plugin: -->
    <script type="text/javascript">
    require(['bootstrap-multiselect'], function(purchase){
    $('#example-getting-started').multiselect();
    });
    </script>
    

© 2012 - 2021 David Stutz, Impressum, Datenschutz - dual licensed: Apache License v2.0, BSD 3-Clause License