Multiple Select With Dropdown List – multiselect

Category: Form , Javascript | January 28, 2019
Views Total:21,282 views
Official Page:Go to website
Last Update:January 28, 2019


Multiple Select With Dropdown List – multiselect


A vanilla JavaScript multi-select plugin that transforms the normal multi-select element into a user-friendly tags input.

The users are allowed to select multiple options from the dropdown select. Click the ‘X’ button to remove the selected option.

How to use it:

Import the main JavaScript and Stylesheet into the document.

<link rel="stylesheet" href="css/style.css">
<script src="js/index.js"></script>

Attach the plugin to a multi-select element and done.

<select multiple="multiple" id="myMulti">
var myDrop = new drop({
    selector:  '#myMulti'

Specify an array of preselected options.

var myDrop = new drop({
    selector:  '#myMulti'
    preselected: [0, 2]

You Might Be Interested In:

4 thoughts on “Multiple Select With Dropdown List – multiselect

  1. sasikumar vediyappan

    But Not getting the form submitted values, please let me know how about getting the values

  2. rok

    yes… please how to get selected values from this dropdown to insert it in mysql trought php??
    thank you

    1. Graham Holmes

      If it helps … in PHP, in the select tag, put

      name=multi[], id=multi

      The square bracket allows for multiple values to be fed back as an array in the $_POST[‘multi’] system variable. I’m guessing that other languages will be similar.


Leave a Reply