bootstrap-select
bootstrap-select copied to clipboard
Changing core options dynamically
I want to dynamically disable or enable live search. Is it possible to change core options programmatically?
I tried this:
<select name="location[]" required class="bootstrap" multiple id="location_select" data-live-search="true" title="<i class='fa fa-map-marker'></i> Select Location" data-size="10" data-selected-text-format="count > 3" data-hide-disabled="true">
<option value="closest">Closest to me</option>
<option value="all">All Locations</option>
<optgroup label="Filter Locations">
...
</optgroup>
</select>
$('#location_select').on('change', function() {
var val = $("#location_select option:selected").val();
var $this = $(this);
if(val == 'closest' || val =='all'){
$this.data('live-search',false);
$this.selectpicker('refresh');
}
});
I have found this post while looking for the anwer for the same question ;) So now two of us are waiting for the solution ;)
Here's fiddle for some tests: https://jsfiddle.net/hc6qcorc/
Working solution, but ugly in my opinion: https://jsfiddle.net/hc6qcorc/2/
Hoping to make this available in an upcoming update, but @giero's solution is the best method for now.