Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
- Enhancing native selects with search.
- Enhancing native selects with a better multi-select interface.
- Nesting optgroups: native selects only support one level of nesting. Select2 does not have this restriction.
- Tagging: ability to add new items on the fly.
- Working with large, remote datasets: ability to partially load a dataset based on the search term.
- Paging of large datasets: easy support for loading more pages when the results are scrolled to the end.
- Templating: support for custom rendering of results and selections.
- Fully skinnable, easy to customize it and integrate in your theme.
1. Include the ".css" and ".js" Select2 files in the <head> section of your HTML.
- You can use the "cdnjs" repository:
You must have the jQuery included Before the Select2 files.
2. Initialize Select2 on the <select> element that you want to make awesome:
In the archive for the Download link there are two different Select2 builds:
- Standard (select2.js / select2.min.js) - It includes the most commonly used features.
- Full (select2.full.js / select2.full.min.js) - Use this build if you need the additional features from Select2, like the compatibility modules or recommended includes like jquery.mousewheel.