003d6053a9
This prevents scrolling within scrollable containers (excluding the dropdown) when the dropdown is open. This fixes an issue where the dropdown would go out of sync with the parent container when the parent container was scrolled. We did not have this issue in past versions of Select2 because the mask prevented any scrolling. Now that we have removed the mask, we have to deal with scrolling from different areas of the page. We initially tried to hook into the `scroll` events of the parent containers, but because of a list of issues we decided against it. If the container scrolled out of view, the dropdown would still be left open and above everything else, even though the container wasn't visually connected to it. The `scroll` event does not bubble, so we need to attach the `scroll` handler to every parent element that is scrollable. Since it is surprisingly difficult to determine if an element is scrollable, we modified some CC-BY-SA code and use that to determine if the element has a scrollbar. The original `hasScroll` function can be found at http://codereview.stackexchange.com/q/13338, the same link left within the code, and was originally designed to be a sizzle selector. As Select2 does not require a sizzle-compatible version of jQuery, we converted it into a function that could be used with `.filter` to filter down the elements. This closes https://github.com/select2/select2/issues/2975. |
||
---|---|---|
dist | ||
docs | ||
src | ||
tests | ||
vendor | ||
.editorconfig | ||
.gitignore | ||
.jshintignore | ||
.jshintrc | ||
.travis.yml | ||
bower.json | ||
component.json | ||
composer.json | ||
CONTRIBUTING.md | ||
Gruntfile.js | ||
LICENSE.md | ||
package.json | ||
README.md | ||
select2.jquery.json |
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.github.io/
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
- Wicket-Select2 (Java / Apache Wicket)
- select2-rails (Ruby on Rails)
- AngularUI (AngularJS)
- Django
- Symfony
- Symfony2
- Bootstrap 2 and Bootstrap 3 (CSS skins)
- Meteor (Bootstrap 3 skin)
- Meteor
- Yii 2.x
- Yii 1.x
- AtmosphereJS
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 this repository
in the docs
folder.
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.