1f3eceba5a
In order to enable the ability to uniquely identify a result by an ID in the DOM, we generate a new ID for the result based on a combination of things, including the container ID prefix that is generated and used elsewhere in Select2. This has worked fairly well for use cases including attaching Select2 to an existing `<select>` and loading in options from a remote data set. Unfortunately, because this process relied on the container ID being used as a prefix, this failed for options which were automatically generated on initialization using the `data:` option to Select2. These were not being generated with an ID because at the time that they were being generated, the data adapter was not aware of the container it was being used in. This broke some accessibility features because we had a mix of options in the results list with IDs, and some without, so we fixed the ordering to make this work. Option generation no longer happens when the data adapter is first initialized, which is where it was previously happening, and instead it now occurs when the data adapter is bound to the container. This allows us to ensure that the data adapter is always aware of the container it is being associated with, so now it will be able to generate the result IDs. This also fixes the tests for the array adapter as well as the legacy `<input />` adapter so they properly bind to a container during the test. This was causing test failures becuase the options which would previously be generated during initialization were no longer appearing. Fixes #4350 |
||
|---|---|---|
| .github | ||
| dist | ||
| docs | ||
| src | ||
| tests | ||
| .editorconfig | ||
| .gitignore | ||
| .jshintignore | ||
| .jshintrc | ||
| .travis.yml | ||
| bower.json | ||
| CHANGELOG.md | ||
| component.json | ||
| composer.json | ||
| Gruntfile.js | ||
| LICENSE.md | ||
| package.json | ||
| README.md | ||
Select2
Select2 is a jQuery-based replacement for select boxes. It supports searching, remote data sets, and pagination of results.
To get started, checkout examples and documentation at https://select2.org/
Use cases
- Enhancing native selects with search.
- Enhancing native selects with a better multi-select interface.
- Loading data from JavaScript: easily load items via AJAX and have them searchable.
- 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.
Browser compatibility
- IE 8+
- Chrome 8+
- Firefox 10+
- Safari 3+
- Opera 10.6+
Usage
You can source Select2 directly from a CDN like JSDliver or CDNJS, download it from this GitHub repo, or use one of the integrations below.
Integrations
Third party developers have created plugins for platforms which allow Select2 to be integrated more natively and quickly. For many platforms, additional plugins are not required because Select2 acts as a standard <select> box.
Plugins
- Django
- Drupal - drupal-select2
- Meteor - meteor-select2
- Ruby on Rails - select2-rails
- Wicket - wicketstuff-select2
- Yii 2 - yii2-widget-select2
- Angularjs - mdr-angular-select2
Themes
- Bootstrap 3 - select2-bootstrap-theme
- Bootstrap 4 - select2-bootstrap4-theme
- Flat UI - select2-flat-theme
- Metro UI - select2-metro
Missing an integration? Modify this README and make a pull request back here to Select2 on GitHub.
Internationalization (i18n)
Select2 supports multiple languages by simply including the right language JS
file (dist/js/i18n/it.js, dist/js/i18n/nl.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 here on GitHub.
Documentation
The documentation for Select2 is available
through GitHub Pages and is located within the separate select2/docs repository.
Community
You can find out about the different ways to get in touch with the Select2 community at the Select2 community page.
Copyright and license
The license is available within the repository in the LICENSE file.