1
0
mirror of synced 2024-11-26 06:46:04 +03:00
Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
Go to file
Kevin Brown 003d6053a9 Prevent scrolling in scrollable containers
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.
2015-01-27 16:06:27 -05:00
dist Prevent scrolling in scrollable containers 2015-01-27 16:06:27 -05:00
docs Fixed dropdown for responsive widths 2015-01-27 14:07:44 -05:00
src Prevent scrolling in scrollable containers 2015-01-27 16:06:27 -05:00
tests Changed how the builds are done 2015-01-22 14:49:39 -05:00
vendor Added jQuery.mousewheel support 2015-01-02 20:32:14 -05:00
.editorconfig Working on rendering everything 2014-10-21 21:43:56 -04:00
.gitignore Start working on translations 2014-10-31 22:24:59 -04:00
.jshintignore Added very basic jshint config 2014-10-21 21:43:57 -04:00
.jshintrc Improved the jshint config a bit more 2014-10-21 21:43:58 -04:00
.travis.yml Add IRC notifications for build failures/changes 2015-01-09 20:56:06 -05:00
bower.json Updated package files 2015-01-07 23:30:05 -05:00
component.json Update version identifiers for 4.0.0-beta.2 2015-01-13 19:18:33 -05:00
composer.json Update version identifiers for 4.0.0-beta.2 2015-01-13 19:18:33 -05:00
CONTRIBUTING.md Updated README and CONTRIBUTING 2015-01-09 19:26:59 -05:00
Gruntfile.js Changed how the builds are done 2015-01-22 14:49:39 -05:00
LICENSE.md Updated README and CONTRIBUTING 2015-01-09 19:26:59 -05:00
package.json Update version identifiers for 4.0.0-beta.2 2015-01-13 19:18:33 -05:00
README.md Updated README and CONTRIBUTING 2015-01-09 19:26:59 -05:00
select2.jquery.json Update version identifiers for 4.0.0-beta.2 2015-01-13 19:18:33 -05:00

Select2

Build Status

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

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.

The license is available within the repository in the LICENSE file.