Bootstrap Silviomoreto's bootstrap-select Cancel/Save button (and Submenu text)

Viewed 682

I am using BS 3.3.6 and Bootstrap-Select plugin.

I would like to know if there is a way to add 'Save'/'Cancel' buttons to the select so that the selection is only saved if the 'Saved' button is pressed. If 'Cancel' is clicked (or a click outside of the select is made), then newly selected options would be discarded and previously selected options (if any) would remain.

The plugin already has a similar button concept, but with 'Select All'/'Deselect All' options. enter image description here

Code with Pre-selected options:

<select class="selectpicker" multiple title="Features">
  <optgroup label="Bench" data-max-options="1">
    <option selected="true" data-content="<span class='label label-success'>Bench</span>">Bench</option>
    <option data-content="<span class='label label-warning'>Bench</span>">Bench</option>
  </optgroup>
  <optgroup label="Shelter" data-max-options="1">
    <option data-content="<span class='label label-success'>Shelter</span>">Shelter</option>
    <option selected="true" data-content="<span class='label label-warning'>Shelter</span>">Shelter</option>
  </optgroup>
  <optgroup label="Trash" data-max-options="1">
    <option data-content="<span class='label label-success'>Trash</span>">Trash</option>
    <option data-content="<span class='label label-warning'>Trash</span>">Trash</option>
    <option data-content="<span class='label label-default'>Trash</span>">Trash</option>
  </optgroup>
</select>

JSFiddle Demo

On a side note, is there a way to add Submenu text to custom (styled) options?

Subtext like this: enter image description here to This: enter image description here

I tried the following way, but it didn't work:

<option data-subtext="Test" data-content="<span class='label label-default'>Trash</span>">Trash</option> </optgroup>
0 Answers
Related