Author: | bluzky |
---|---|
Views Total: | 0 views |
Official Page: | Go to website |
Last Update: | February 4, 2025 |
License: | MIT |
Preview:

Description:
A pretty nice select box replacement library that converts the regular select element into an animated, customizable, searchable dropdown list.
How to use it:
1. 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>
// OR # NPM $ npm i nice-select2
import NiceSelect from "nice-select2"; @import "~nice-select2/dist/css/nice-select2.css"
2. 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"));
3. Enable/disable the searchable functionality. Default: false (disable).
NiceSelect.bind(document.getElementById("example"),{ searchable: true });
4. API methods.
instance.update(); instance.focus(); instance.enable(); instance.disable(); instance.clear(); instance.destroy();
Changelog:
v2.3.1 (02/04/2025)
- [FIX] Method .clear needs to deselect options.
v2.1.0 (01/26/2023)
- [FIX] Method .clear needs to deselect options.
- Added option to show selected items
- Fixed a bug in which the selection was not made even if it was selected again.
- fixed: issue when first option was always selected
v2.0.0 (01/14/2023)
- This release makes it possible to include nice-select2 in your webpack import
- added: invalid and valid class
- bugfixes
12/22/2021
- update
10/12/2021
- update
10/10/2021
- clean dependency
09/25/2021
- JS updated