Preface
Implementing a multi-select dropdown list with BootstrapMultiselect
Preparations
Importing Dependencies
1
2
3
4
5
6
7
8
| <link rel="stylesheet" href="dist/css/bootstrap.css">
<link rel="stylesheet" href="dist/css/bootstrap-multiselect.css">
<script src="dist/js/jquery.js"></script>
<script src="dist/js/bootstrap.js"></script>
<script src="dist/js/bootstrap.bundle.js"></script>
<script src="dist/js/bootstrap-multiselect.js"></script>
|
HTML to Generate Multi-Select Dropdown List
- HTML transforms a normal dropdown list into a multi-select dropdown list
1
2
3
| <select class="form-control" id="select" multiple="multiple">
<option value="1">One</option>
</select>
|
Initializing Multi-Select Dropdown List with JS
1
| $('#select').multiselect();
|
Event for Changing Select Status
1
2
3
4
5
| $('#select').multiselect({
onChange: function(option, checked, select) {
...
}
});
|
Completion
References
Bootstrap Multiselect Chinese Website