View on GitHub

popup-multiselect

A popup with options. Allows multi select. Based on Bootstrap. Now upgraded to Bootstrap 4.

Examples

Download this project as a .zip file Download this project as a tar.gz file

Basic Example

Code

$("#industries1").multiselect({title: "Select Industry",
                    maxSelectionAllowed: 5, modalSize: "md"});

Getting Values

['AGRICULTURE', 'FOOD, BEVERAGE & TOBACCO']

Code

$("#industries1").multiselect("getSelected").val();

Basic Example (Disabled)

Code to enable

$("input.enable").on("click", function(){
                  $("#industries2").multiselect("enable");
                  });
                

Code to disable

$("input.disable").on("click", function(){
                $("#industries2").multiselect("disable");
                });

Basic Example (Action and Events)

Selecting/Deselecting already present option
Adding a new option dynamically

Events

Code to show

$("input.show3").on("click", function () {
                  $("#industries3").multiselect("show");
                  });
                

Code to hide

$("input.hide3").on("click", function () {
                $("#industries3").multiselect("hide");
                });

Code to select

$("input.select3").on("click", function () {
                $("#industries3").multiselect("selectOption", $("#optionValue").val().trim());
                });

Code to deselect

$("input.deselect3").on("click", function () {
                $("#industries3").multiselect("deselectOption", $("#optionValue").val().trim());
                });

Code to add option

$("input.addOption3").on("click", function () {
                var option = {
                value: $("#newOptionValue").val(),
                html: $("#newOptionText").val(),
                selected: $("#newOptionSelected").prop("checked")
                }
                $("#industries3").multiselect("addOption", option);
                });