Select2

Select2 allows developers to customize how drop-down select elements and optgroups are displayed on a page.

It not only allows developers to use custom skins, but also modifies the way select elements are used as well.

Select2 deeply alters how drop-down selects work, enhancing their UI and UX with more user-friendly features.

While this might seem unsolicited, most of the added features are not only desired by developers, but end users seem to like having them at their disposal as well.

Select2 can make the process of selecting an item from a list a lot more friendly, and a lot faster as well.

This jQuery plugin is based on the Chosen script.

What is new in this release:

• A more flexible plugin framework that allows you to override Select2 to behave exactly how you want it to.
• Consistency with standard <select> elements for all data adapters, removing the need for hidden <input> elements.
• A new build system that uses AMD to keep everything organized.
• Less specific selectors allowing for Select2 to be styled to fit the rest of your application.

What is new in version 4.0.0:

• A more flexible plugin framework that allows you to override Select2 to behave exactly how you want it to.
• Consistency with standard <select> elements for all data adapters, removing the need for hidden <input> elements.
• A new build system that uses AMD to keep everything organized.
• Less specific selectors allowing for Select2 to be styled to fit the rest of your application.

What is new in version 3.5.2 / 4.0.0-rc2:

• Fix error: Cannot read property 'top' of undefined
• Handling mousemove more delicately
• Calling destroy when still open results in an exception
• Query as third parameter to ajax results callback
• Better support for RTL languages
• SyncCssClasses
• "select2-selecting" event returning with bad parameters.
• IE8 does not support Array.prototype.forEach
• Unbind onpropertychange event handler on destroy for IE8-10
• formatMatches makes no sense if there is only one result
• Dynamically set language

What is new in version 3.4.7:

• Cleanup jQuery DOM elements on destroy
• Recalculation dropdown height if dropdownAutoWidth is true
• Fixes issue syncing CSS classes in IE9/10
• Testing if the dropdown is opened before call positionDropdown
• Select2 creates invalid HTML, stops working
• Trap touch events within container
• Prevent the cursor from setting it to initial position in IE
• Mobile (iOS 7) select2-result Selection Leaks Click Through to Next Screen
• tabindex chain is broken when selecting a value with keyboard
• Destroy broken on selections with length > 1

What is new in version 3.4.6:

• Improve position of dropdown when opening up
• Initial fix for main accessibility issues
• Fixed string used as regular expression for ID attribute
• Prevent delayed focus when the list is hidden
• Compatibility with jQuery 1.9 +
• formatResultCssClass option ignored when attached to select
• Select2 Arabic Translate.
• .select2("data", null) causes an error
• Adding createSearchChoice at the end
• Georgian (Kartuli) language translation
• Pressing Enter on a multi select when not highlighting produces duplicate last value
• Styling fixes for RTL direction
• Fixed typos

What is new in version 3.4.4:

• Update to select2.js to trigger properly named event.
• Fixed selection first element from "postprocessResults"
• Corrections for the greek (el) locale file
• Updated select2_locale_fi.js
• Updated select2-bootstrap.css
• Uses more specific selector for finding options of a select
• Dropdown repostion fix when previous postion changes container position
• Fixes styling in bootstrap environment
• Fixes the focus when list is closed on the mouse click event

What is new in version 3.4.3:

• Edit the default initSelection function to pass all tag properties
• Avoid locked options to be selected and deleted.
• Remove duplicated options from multi-valued select boxes.
• Updated docs for `select2-clearing` event.
• Added `select2-clearing` event
• Remove negative selector for `.select2-selected`
• Fix focus on select

What is new in version 3.4.1:

• Always call createSearchChoice and tokenizer with the Select2 object as this.
• Replaces a <div> inside a with a.
• Fixed data not passed in select2-loaded event.
• Added Indonesian Translation.
• Easier use of span elements for selection formatting.
• Added Korean Translation.
• Added border to active element drop down.

What is new in version 3.4.0:

• Add option to automatically size dropdown width
• Allow to prevent default behavior on selection
• Can not tab out of multiple select field once all options have been selected
• Missing bottom blue border on active opened upwards
• BUG Keyboard entry is not working on IOS (iPhone / Ipad) for multi-select inputs
• Increase width of dropdown to make long values fully visible.
• Fix compatibility with jQuery 1.9.1 for options with no 'value' property
• I can't make it work on <select> element when using jquery-1.9.1
• Fast typing on a closed select loses some keypresses.
• Dependency on bootstrap styles
• No Documentation on Json/Ajax response/Request format
• Selecting option with TAB should focus next input
• Add blur/focus event triggerings (#798)
• Problem escaped caracter on IE7
• Down arrow key opening the original select
• Can't detect the Focus & Blur events
• readonly != disabled
• ERROR: abstract function close firing "close" event without using proper namespacing
• Scrollback occurs when opening dropdown and search box is hidden
• Multiple: When only results are already selected, no message shown

What is new in version 3.3.2:

• Added pt-PT localisation
• Multi-select tries to update dropdown after it has been destroyed
• Fixed 2 typos in the French translation
• Added french translation
• Inconsistent keyboard shortcut behavior between Firefox and Chromium
• select2.js vs select2.min.js - dropping classes
• Missing "data.element" property in formatSelection when executing "[select2].val(...)"
• Default local initSelection doesn't work with nested data
• How to know that data is loaded from server
• Exception while choosing a value
• Added Brazilian Portuguese translation
• Delete license from the minified JS

What is new in version 3.0:

• Optgroups are now supported in selects. N-level deep nesting of results is supported when attached to input[type=hidden], see the new children property described in the docs.
• Signature of initSeletion has changed to support initialization from asynchronous requests.
• Dropdown will now open below or above the control depending on available screen space. No more scrolling the page to see to see all matched results.
• Signature of formatSelection and formatResult changed in a backwards compatible way to support more powerful constructs than supported by strings alone.
• Separator in multi-valued selects is now cofigurable, , still the default. See separator option in the docs.
• Matching is now customizable. See matcher function in the docs and the Custom Matcher example.
• change event now specifies which elements were added/removed
• width option now supports various strategies instead of always being copied from the source element
• Clicks on a label associated with the source element are now redirected to Select2.
• val will now only accept ids, if you want to specify the full object for the selection use the new data method instead. val will also now only work on non-selects if initSelection was specified.

What is new in version 2.1:

• Added support for disabled mode.
• Added ability to provide custom matcher functions.
• Minimum required jQuery version bumped to 1.4.4.

Requirements:

• JavaScript enabled on client side
• jQuery 1.7.1 or higher