Methods
Methods can be called on the select element to control the bootstrap-select instance.
.selectpicker('val')
Sets the selected value. This is the preferred method for changing the value, as it properly updates the UI.
// Set a single value
$('.selectpicker').selectpicker('val', 'Mustard');
// Set multiple values
$('.selectpicker').selectpicker('val', ['Mustard', 'Relish']);
.selectpicker('selectAll')
Selects all items in a multi-select dropdown.
$('.selectpicker').selectpicker('selectAll');
.selectpicker('deselectAll')
Deselects all items in a multi-select dropdown.
$('.selectpicker').selectpicker('deselectAll');
.selectpicker('render')
Forces a re-render of the bootstrap-select UI. This is useful if you programmatically change underlying values that affect the layout.
$('.selectpicker').selectpicker('render');
.selectpicker('refresh')
Updates the UI to match the new state of the <select>
element. This is essential when you add, remove, disable, or enable options programmatically.
// Example: Removing an option
$('.my-select').find('[value=Mustard]').remove();
$('.my-select').selectpicker('refresh');
// Example: Disabling the select
$('.my-select').prop('disabled', true);
$('.my-select').selectpicker('refresh');
.selectpicker('toggle')
Programmatically toggles the bootstrap-select menu open or closed.
$('.selectpicker').selectpicker('toggle');
.selectpicker('open')
and .selectpicker('close')
Programmatically open or close the menu.
// Open the menu
$('.selectpicker').selectpicker('open');
// Close the menu
$('.selectpicker').selectpicker('close');
.selectpicker('show')
and .selectpicker('hide')
Programmatically show or hide the entire component.
// Hide the component
$('.selectpicker').selectpicker('hide');
// Show the component
$('.selectpicker').selectpicker('show');
.selectpicker('destroy')
Removes the bootstrap-select functionality and returns the <select>
element to its original state.
$('.selectpicker').selectpicker('destroy');