multiselect-dd

multi select drop down

Usage no npm install needed!

<script type="module">
  import multiselectDd from 'https://cdn.skypack.dev/multiselect-dd';
</script>

README

Multi Select (simple javascript library)!

Simple javascript library to Multi Select

npm install: Generic badge

    npm i multiselect-dd

add script and css (soon to publish on npm)

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/immi5556/immanuel.npm@v0.0.6/Immanuel.a7.npm/Immanuel.a7.tablebuilder/multiselect_dropdown/dist/multiselect.css" />
<script src="https://cdn.jsdelivr.net/gh/immi5556/immanuel.npm@v0.0.6/Immanuel.a7.npm/Immanuel.a7.tablebuilder/multiselect_dropdown/dist/multiselect.js"></script>

Documentation

    var mySelectCheckbox = new checkbox_select(
        {
            selector: "#make_checkbox_select",
            selected_translation: "selectat",
            all_translation: "Toate marcile",
            not_found: "Nici unul gasit",

            // Event during initialization
            onApply: function (e) {
                //alert("Custom Event: " + e.selected);
                //$("#selected-val").append('<li><a href="javascript:void(0);">Lord Jesus my Saviour<span>X</span></a></li>');
                $("#selected-val").html("");
                (e.selected || []).forEach(t => {
                    var vv = $(`<li><a title='${t}' href="javascript:void(0);">${t}<span data-vv='${t}'>X</span></a></li>`);
                    vv.find("span").on("click", function () {
                        mySelectCheckbox.check($(this).data("vv"));
                        vv.remove();
                    });
                    $("#selected-val").append(vv);
                });
            }
        });

TO DOs: -- Enable few event subscriptions --

Tested & Will work only on modern browsers

Thanks To - https://codepen.io/cjonasw/pen/nFdvw