Easy Customization Of HTML Select Boxes – nice-select2

Category: Form , Javascript | July 16, 2019
Author: bluzky
Views Total: 113
Official Page: Go to website
Last Update: July 16, 2019
License: MIT

Preview:

Easy Customization Of HTML Select Boxes – nice-select2

Description:

A pretty nice select box replacement library which converts the regular select element into an animated, customizable, searchable dropdown list.

How to use it:

Import the nice-select2 plugin’s JavaScript and Stylesheet into the document.

<link href="dist/css/nice-select2.css" rel="stylesheet" />
<script src="dist/js/nice-select2.js"></script>

Just attach the function NiceSelect to the existing select element and done.

<select id="example">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
NiceSelect.bind(document.getElementById("example"));

Enable/disable the searchable functionality. Default: false (disable).

NiceSelect.bind(document.getElementById("example"),{
  searchable: true
});

Update & destroy the instance.

instance.update();
instance.destroy();

You Might Be Interested In:


Leave a Reply