The dual listbox is created from a select multiple by calling .bootstrapDualListbox(settings);on a selector. The selector can be any element, not just selects. When the method is called on a selector other than a select, then all select childrens are converted into dual list boxes. This example demonstrates singleoption selection.

Multiple selection example. By default, only single selection is allowed: once you click on the option, it automatically moves to another box. To disable single selection and turn on multiple, set moveOnSelectoption to falsein plugin configuration. Defaults to trueand this option is forced to trueon the Android browser.

The following example demonstrates initialization of the dual listbox with a filter for the non selected elements, currently from 7 to 12. This can be applied only if showFilterInputsis set to true. Using selectedFilteroption, listbox will filter selected elements only. You can use "Display all" button as a filter reset.

The following example demonstrates listbox with disabled filter input. By default, filter input field is always visible, unless showFilterInputsoption is set to false. Please note: if false, all additional filter options such as filtered results will be disabled, but all plugin options related to selects will remain available.

This example demonstrates ability to change the minimal height of the generated dual listbox. Default listbox height is 200px, in this example the height is increased up to 300pxusing selectorMinimalHeightoption. This value is applied to the list itself, but not to the whole container with other elements.

This example demonstrates how custom text or language can be used in dual listbox controls. All these text labels and placeholders are fully editable through specified options, such as: infoText, infoTextFiltered, infoTextEmpty, filterPlaceHolderetc.

The options must be added to/removed from the original select. Note that the bootstrapDualListbox.refreshevent must be triggered on it after manipulating the options. If there are some highlighted options in the lists, then triggering the bootstrapDualListbox.refreshevent with the optional trueparameter results the highlights to be removed.