I use the excelent BsMultiSelect on my app, but I had the need to programmatically deselect all items in a given field on the screen.
What is the best way to programatically deselect all options?
And, there is any way (property) to set the mínimum/maximum selected items? I have a select min 2/max 5 in 30 options.
Deselect All here:
P.S. Could you move "how to setup mínimum/maximum" to new SO question? I do not like the idea to post two snippets or mix two answers in one snippet.
$("#mySelect").bsMultiSelect();<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@dashboardcode/bsmultiselect@0.6.2/dist/js/BsMultiSelect.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<div class="form-group m-2">
<label for="mySelect">BsMultySelect</label>
<select id="mySelect" class="custom-select" name="status2" multiple='multiple'>
<option value="C0" selected>Asia</option>
<option value="C1" selected>Europe</option>
<option value="C2">Australia</option>
<option value="C3">America</option>
<option value="C4">Africa</option>
</select>
</div>
<div class="form-group m-2">
Bootstrap4/JQuery method's call convention
<pre>$(mySelect).bsMultiSelect('DeselectAll');</pre>
<button onClick="$(mySelect).bsMultiSelect('DeselectAll')">Deselect All</button>
<button onClick="$(mySelect).bsMultiSelect('SelectAll')">Select All</button>
</div>
<div class="form-group m-2">
API call
<pre>var api = $(mySelect).BsMultiSelect();
api.deselectAll();</pre>
<button onClick="$(mySelect).BsMultiSelect().deselectAll()">Deselect All</button>
<button onClick="$(mySelect).BsMultiSelect().selectAll()">Select All</button>
</div>