There are multiple options for including these pre-complied files, also known as a distribution, in any website or application.
Using Select2 from a CDN
A CDN (content delivery network) is the fastest way to get up and running with Select2!
Installing with Bower
Select2 is available on Bower. Add the following to web application bower.json file and then run bower install
Or, run bower install select2 from the project directory
The precompiled distribution files will be available in vendor/select2/dist/css and vendor/select2/dist/js/, relative to your project directory. Include them in your page:
Use Cases of Select2.js
- 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.
- IE 8+
- Chrome 8+
- Firefox 10+
- Safari 3+
- Opera 10.6+
Select2 support multiple languages by simply including the right languages JS file (dist/js/i18n/it.js, dist/js/i18n/n1.js, etc.) after dist/js/select2.js.
Missing a language? Just copy src/js/select2/i18n/en.js, translate it, and make a pull request back to Select2 from Github.
Usage – here I’m going to share with a small use of Select2.js
<select class=”select2” name=”state”>
Now, put below jQuery code just before end of the </body> tag
For multiselect dropdown, use multiple attribution to <select> tag
<select class=”select2” name=”state” multiple=”multiple”>
Select2 can also load data from AJAX request, just put <select> option blank and use the below code in <script> tag
Select2 can also load data from local array.
var data = [