This adds basic support for focusing the Select2 element by triggering
the `focus` event on the underlying <select> element. This implicitly
adds support for <label> elements, which will trigger the `focus` event
on the `<select>` if it is clicked.
This also fixes the focus issue that previously existed if Select2 was
opened while in a <label>. The focus would be transferred to the search
dropdown, and then immediately pulled away to the <select> element. This
happened because the <label> element triggers the `focus` event when a
`click` event propagates its way up, and we do not stop the propagation
of the `click` event when it is triggered on the selection.
This closes https://github.com/select2/select2/issues/2311.
This closes https://github.com/select2/select2/issues/4203.
This closes https://github.com/select2/select2/pull/4235.
Previously the tokenizer only worked when creating multiple options
at once if all of the options existed. It always worked when creating
a single option, because all of the special cases were handled by the
tagging module. When working with multiple options, the tagging
module does not kick in until after the query has been run, which
is when the tokenizer does its magic.
This fixes the issue by automatically creating the option tags that
the tagging module would normally create. It only does this if the
options do not already exist, so we don't need to worry about the
tokenizer creating duplicates of existing options.
This closes https://github.com/select2/select2/issues/3458
The error handler should not be raised if a request is aborted while
another one is sent out. This attempts to detect those cases by
handling the case where the error was raised and the request has a
status code of 0, which should either mean we're in offline mode or
the request was aborted.
This closes https://github.com/select2/select2/issues/4205
Previously the `dropdownAutoWidth` option didn't work because the
dropdown was being absolutely positioned, so setting the width to
`auto` didn't actually have an effect. This cannot be solved by
just setting the width on the container, because that is also
absolutely positioned.
This closes https://github.com/select2/select2/issues/3101
This fixes an issue that has existed since Select2 4.0.1 where the
arguments passed into each `<select>` were mutated. This no longer
mutates the arguments for each element, and instead only drops the
first argument once.
This closes https://github.com/select2/select2/issues/4245
- updated transaltions
- added translation for errorLoading
- issue fixes - compare characters length instead of message when adding terminal character
This closes https://github.com/select2/select2/pull/4208
This display the `errorLoading` translation when there is an error
during the AJAX cycle. Previously we were just throwing these errors
out, now we are actually displaying an error message.
This closes https://github.com/select2/select2/issues/3501
This fixes an edge case that occurred pretty much whenever anyone would
use array data with existing selections along with a placeholder. This
caused the existing selections to be discarded, because the `selected`
property was not being transferred over to the new option. This was
based the new data was being preferred over the data that could be
inferred from the option, and the new data typically did not include the
selected state. As a result, the option was assumed to not be selected.
This was not cause by existing tests because all of the existing tests
only covered cases where the selected option was the first option, and
that was not affected by this bug.
This call to `$.fn.position` was causing an error in IE 8 because the
`offsetParent` was null on the container for some reason. It's not
needed, so this line of code has been removed.
This should fix the test failures in IE 8.
There was a commit that landed in 4.0.1 that fixed positioning for
non-static elements, which are commonly used for the custom
`dropdownParent` option, but broke positioning for statically positioned
elements, commonly used in almost every other case. That commit was
c9216b4b96
This fixes the positioning issues caused by that commit by properly
calculating the offsets for statically positioned parents. Statically
positioned parents are unique, because the offset for the dropdown must
be calculated based on the closest element that is non-statically
positioned. Otherwise, the offset for any statically positioned parent
other than the body will be considerably higher than it should be,
resulting in the dropdown being offset by a large amount.
The offset parent for the body element is the html element, which is why
this works for both the body element and any custom parents for the
dropdown. This would not be needed if the parent wasn't customizable (as
seen in Select2 3.x) because you will never need to offset the body
element if it is statically positioned, because the html element almost
never has an offset.
This also fixes JSHint issues within the tests added in the last commit.
This closes https://github.com/select2/select2/issues/3970
This closes https://github.com/select2/select2/issues/3639
This fixes an infinite loop that used to be caused when both
`closeOnSelect` and `selectOnClose` used to be combined, because they
both were listening to events triggered by the other one. The problem
was that `selectOnClose` was triggering `select` events for data objects
which had already been selected. This problem was solved by checking if
the data object was already selected before trying to select it again.
This closes https://github.com/select2/select2/pull/3751.
This closes https://github.com/select2/select2/issues/3169.
In
f1e86470ca
we tried to fix the issue where multiple instances created in a single
call would share the same options, and this worked for the most common
cases. Unfortunately it did not work for the case where data attributes
were also used with an options object, and as a result data attributes
would be copied to all instances. Data attributes are supposed to be
specific to a single instance.
This was fixed by moving the `true` for the deep copy to the start of
the `$.extend` call, as this is where jQuery looks for the deep copy
flag.
This closes https://github.com/select2/select2/issues/3485
This fixes a previous bug with the backspace handler on the multiple
select search box where unselecting a choice through the keyboard would
not properly size the search box. As a result, most of the text would be
cut off and it was very clear that there was an issue.
In addition, a blank space was automatically being added to the end of
the search query. This blank space would not be removed at all, so the
user had to manually remove it.
Additionally, a query would be triggered for the last used search term
instead of the new search term that would be loaded in. This caused
incorrect results to be displayed most of the time.
All of these issues have been fixed by triggering a new search query
after an option has been removed through the keyboard. This will resize
the search box automatically, which fixes the main issue, and it will
trigger a search with the correct query.
This closes https://github.com/select2/select2/issues/3297
This closes https://github.com/select2/select2/pull/3398
This fixes an issue when any of Select2's special options are called on
multiple elements, it would only affect the first option in the group.
This was because Select2 was only applying any changes to the first
element in the group (as chosen by jQuery) instead of applying changes
on each and every element within the list.
This has the new side effect of special options like `select2('data')`
returning the results for the last element in the list instead of the
first element. Because the previous functionality was considered
unspecified behaviour, this is not being treated as a breaking change.
This closes https://github.com/select2/select2/issues/3413
This closes https://github.com/select2/select2/pull/3495
This will now pass all of the AJAX parameters into the AJAX request as
query string parameters, so now the page number (and other variables)
will be set automatically. This can still be overridden in `ajax.data`
to pass anything else, but this should make it easier for the most
common case.
This closes https://github.com/select2/select2/issues/3548
This closes https://github.com/select2/select2/pull/3552
This fixes an issue where the old `option` and `load-more` classes were
not switched over to the newer BEM style of class names. Unfortunately
this is a breaking change, but this is also a bug given that it doesn't
follow the proper prefixing and is likely to conflict with larger
applications.
https://github.com/select2/select2/issues/3889
Previously `this` would point to the AjaxAdapter that was being used to
process the AJAX, or sometimes the JS object holding the AJAX options,
instead of the jQuery element that Select2 was attached to. This fixes
the issue so `this` will consistently point to the jQuery element, just
like in past versions of Select2.
This closes https://github.com/select2/select2/issues/3361
This closes https://github.com/select2/select2/pull/3410
About `errorLoading`:
Before the correction, the translation was: "התוצאות לא נטענו בהלכה".
The word "בהלכה" is wrong and should be spelled "כהלכה", but besides that, this translations means "The results were loaded improperly", while my corrected translation means "Error while loading results", which is what needed.
About `inputTooLong`, `inputTooShort`, `maximumSelected`:
In Hebrew, it's not acceptable to have the digit 1 for representing a single object. You should use the actual word "one", which is "אחד" in Hebrew together with the singular noun (e.g. "one item" / "one character", instead of "1 item" / "1 character").
**These 3 parts needed a critical fix anyway**, because they were addind the English letter 's' to the end of the Hebrew string.
About `loadingMore`:
The translation was "טען תוצאות נוספות" which means "Load more results", as an instruction, probably a typo.
I changed "טען" to "טוען" so now it means "loading more results", which is the correct form.
This closes https://github.com/select2/select2/pull/3911
Previously we were only disabling the `input` handler when it was
triggered, which caused a race condition within the `keyup` handlers
which also was triggered by the `input` event. This fixes the issue by
also unbinding the `input` handlers within the `keyup` handler, to avoid
running into the race condition.
Thanks to @Eckankar for pointing out the race condition that still
existed in
66ae2ad1d5
This closes https://github.com/select2/select2/issues/3300
The `createTag` option does allow for `null` to be returned if a
tag should not be created. The tokenizer previously didn't support
this, so the tokenizer should be able to handle this case. Previously
it would trigger an exception, because the tokenizer would pass back
a null value to the select function.
This also fixes what would have been a potential bug where even if a
tag was not created, the term would still have been sliced at the
location of the token. This allows for tokenizers to have special
cases when tokenizing the term, such as not splittting a token
if it is in the middle of a quoted string.
This closes https://github.com/select2/select2/issues/3593
This closes https://github.com/select2/select2/pull/3591
This fixes an issue where preventing the default behaviour on some
events would trigger an exception. This was bacause the event relay
was expecting there to always be an object passed in for arguments,
and this wasn't always the case.
This closes https://github.com/select2/select2/issues/3431.
This prevents selections from being removed when the container is
disabled. This stops any click events that are triggered on the
remove button, so the remove handler won't be triggered at all.
This closes https://github.com/select2/select2/pull/3636.
In the previous commit (02cca7b) support was added for multiple
selects to automatically focus when they were tabbed into. While
this did actually work, it caused a few bugs with the focus that
prevented users from tabbing out of the container, effectively
trapping keyboard users in Select2.
This makes a few major changes to how things work in Select2, but
should not break any backwards compatibility.
- The internal `focus` event is now proxied through a `focus`
method on the core object. This allows for two important things
1. The `focus` event will only be triggered if Select2 was in an
unfocused state.
2. Select2 now (unofficially) supports the `select2('focus')`
method again.
But that does mean that it is possible to trigger the `focus`
event now and not have it propagate throughout the widget. As
it would previously trigger multiple times, even when Select2
had not actually lost focus, this is considered a fix to a bug
instead of a breaking change.
- The internal `blur` event in selections is only triggered when
the focus is moved off of all elements within the selection. This
allows for better tracking of where the focus is within Select2,
but as a result of the asynchronous approach it does mean that the
`blur` event is not necessarily synchronous and may be more
difficult to trace.
- On multiple selects, the standard selection container is never
visually focused. Instead, the focus is always shifted over to
the search box when it is requested. The tab index of the selection
container is also always copied to the search box, so the search
will always be in the tab order instead of the selection container.
It's important to note that these changes to the tab order and how
the focus is shifted do not apply to multiple selects that do not
have a search box. Those changes also do not apply to single select
boxes, which will still have the same focus and tabbing behaviours
as they previously did.
Replaced ArrayAdapter super constructor call with correct AjaxAdapter super constructor call. This will allow users to initialize an Ajax select with data.
`.select2-hidden-accessible` is the CSS class that is added to the original `<select>` element (that Select2 is initialized on) to hide it.
In cases where the original `<select>` has other style declarations assigned which conflict with those of `.select2-hidden-accessible`, the latter styles may be overridden, possibly resulting in the original `<select>` element not being properly hidden.
Similar to what https://github.com/select2/select2/pull/1549 did for Select2 v3's CSS, this adds the `!important` rule to all style declarations for `.select2-hidden-accessible` to make it exponentially harder to override them.
"Engada" in galician is "to add" and therefore should be the base text used for the inputTooShort method, asking the use to add more chars. It seems to be mistakenly defined exactly the opposite it should be (as inputTooLong was containing the right text).
This adds back the `dropdownAutoWidth` option, so the dropdown can
have a width that is automatically determined by the browser. This
works best for smaller dropdowns that contain options with large
amounts of text.
This closes https://github.com/select2/select2/issues/3103.
This closes https://github.com/select2/select2/pull/3113.
Signed-off-by: Kevin Brown <kevin@kevin-brown.com>
The old functionality where classes were directly copied to the
container can be done by setting `dropdownCssClass: ':all:'` when
initializing Select2.
This closes https://github.com/select2/select2/issues/2879.
This improves a regression added in b9b55cec44
that reduced performance for large number of options when using a
jQuery collection object to append multiple options instead of
using a bare array containing the jQuery elements.
As `$.fn.add` is only required for jQuery 1.7.x, we can use a
utility function that only falls back to it for that specific
version of jQuery, and uses `$.fn.append` with an array for all
other versions.
This closes https://github.com/select2/select2/issues/3230.
Since Select2 methods should not be called on an element where
Select2 has not yet been initialized, this raises an error when it
happens. This does not silence the original error, but it does
provide the user with some more context about why they are seeing
a TypeError.
This closes https://github.com/select2/select2/issues/3173.
We now check that the `abort` method actually exists before aborting
the request, as JSONP does not include the `abort` method because
a JSONP request technically cannot be aborted.
This closes https://github.com/select2/select2/issues/3217.
This adds back keyboard support, so you can now clear a selected
item using either the backspace or delete key. This only work when
the container is closed, to prevent issues with the selection being
clear while a user is searching.
This was a regression in accessibility from 3.x.
This closes https://github.com/select2/select2/issues/3224.
Slight performance hit as we are no longer using `qurySelectorAll`,
but it handles the situation a bit more cleanly and prevent future
issues with special characters.
This closes https://github.com/select2/select2/issues/3157.
This fixes the results display so they prefer the `selected`
property on objects over checking if the `id` matches the value of
the underlying select.
We only ignore the `selected` property if it is null, at that point
we compare against the `id` property.
This closes https://github.com/select2/select2/issues/3163.
This also fixes an issue where we were using the `full_name` for
the value instead of the `id` in the example, which technically
wasn't correct.
This closes https://github.com/select2/select2/issues/3148.
Now we can use relative paths in the calls to `require`, so those
using relative builds don't have to worry about modules not being
imported properly. This also makes it considerably easier in the
future when we look to cut down the build sizes and have a custom
builder, as we don't have to worry as much about the paths being
incorrect.
This fixes https://github.com/select2/select2/issues/3014 finally.
Now we do not have separate AMD builds, instead we use a UMD wrapper
to support both AMD and CommonJS environments along with the browser.
This has been tested with RequireJS and it correctly imports Select2
and hooks into jQuery.
This means that all builds will include the Almond AMD loader, but
this isn't that much of an issue when you consider the file sizes.
The loader is namespaced so RequireJS and other AMD builders don't
complain about `require` and `define` existing. This is also done
so AMD loaders don't conflict, as Select2's AMD loader should
operate independently of others.
There are now two layers of wrappers that are applied to files,
only one of which is used for the translation files. This allows
us to only load in the internal Select2 modules once, and in
general makes most things cleaner. These have also been pulled out
into individual JS files instead of being stored in JSON files,
allowing us to add comments and make things look readable.
Because we use a few hacks, these files are heavily commented as well.
This closes https://github.com/select2/select2/issues/2945.
This closes https://github.com/select2/select2/issues/2946.
This finally fixes and adds some integration tests to make sure
that `select2('data')` works as we are expecting. This also adds
tests for `select2('val')` and fixes undefined variable issues
that were spotted because of these tests.
We also no longer date stamp distribution builds.
This closes https://github.com/select2/select2/issues/3104.
This moves the clear icon to the top of the DOM from the bottom to
ensure that it is always visible on top of the selection.
This closes https://github.com/select2/select2/issues/3089.
We don't need to update the dates on these every time that grunt
is called. This gives it a much more basic banner that is similar
to the minified version.
As jQuery 1.7.2 is the lowest version of jQuery supported by Select2,
it makes sense to run the tests on it. For the most part, we can
assume that the newer versions of Select2 are backwards compatible
enough such that this isn't an issue.
The recommended version of jQuery to use is the latest though, which
is why the jQuery file is only included in the tests.
This revealed a few issues with our data fallbacks and `.append`
functionality that was introduced in jQuery 1.8.
This strips whitespace in tags by default, so multiple tags cannot
be created with only whitespace as the difference in the id.
A test has been added to ensure that this remains fixed in the future.
This closes https://github.com/select2/select2/issues/3076.
This fixes an issue with `select2('data')` that caused it to not
work as intended. Because we were using `Select2.data` for the
data adapter, it was overriding the `Select2.data()` method which
was supposed to be used.
This just renames the `Select2.data` property to
`Select2.dataAdapter` to prevent the naming collision.
This closes https://github.com/select2/select2/issues/3104.
This fixes an issue when using a `<select>` where the elements were
created with XHTML-encoded characters to prevent any injection, as
they would be double-encoded and display incorrectly.
When using a `<select>`, we can assume that the data has already
been encoded because any XSS will have already run before we get to
it. Because of this, we can just use `.text()` instead of `.html()`
to avoid any issues.
This also includes a test to ensure that this does not become an
issue in the future.
This closes https://github.com/select2/select2/issues/3115.
This fixes an issue where the dropdown would not automatically
open when something was typed in the search box on a multiple
select. This was most noticeable when the dropdown closed and
the search box was focused and the user started to type, as the
text would appear in the search box, queries would be sent out to
retrieve results, but the dropdown would not be opened to display
the results.
This also fixes an issue introduced in a recent commit where search
queries would be sent out twice on modern browsers that supported
both the `keyup` and `input` event. The `keyup` event is now
properly debounced for these browsers and the queries are only
going out once.
This closes https://github.com/select2/select2/issues/3036.
Previously, when in results the enter key would select items that
were highlighted if they were not already selected. In the case of
a select where multiple items could be selected, pressing enter
when highlighting a selected item would also allow it to be
unselected. While this seems intuitive for accessibility purposes,
the enter button essentially working as a toggle, it caused some
really strange behavior.
- If the enter button was held down, all previously selected items
would be unselected.
- The enter button did not work the same across both single and
multiple selects.
After listening to user feedback, I have decided to remove the
"enter as toggle" functionality from Select2 and have gone back to
just having the enter button select items. This means that instead
of unselected items that are already selected and highlighted,
Select2 will just close the dropdown. This is the same as what
Select2 would previously do for single selects, so the keyboard
functionality is now the same across both.
Because this removed the only easy way to unselect items in the
dropdown using the keyboard, we had to maintain the toggle
functionality. We decided to implement the toggle functionality
on the CTRL + Space keybinding, which is in line with other
applications. Now when pressing CTRL + Space at the same time in
the dropdown, the highlighted result will behave the same as if the
mouse selected it, which will toggle the current item in multiple
select mode and close the dropdown in single select mode.
This is the same keybinding that Windows Explorer [1] and GTK [2]
use for toggling the current selection, which was why it was picked.
This also fixes an issue where keyboard focus would be lost once an
item was unselected from the results. This was due to a bug in the
CloseOnSelect module that would only automatically close the
dropdown when an item was selected, but not when an item was
unselected. Now the dropdown will be closed automatically when an
item is unselected, which will also cause the selection (and
eventually the search) to be focused.
This fixes two issues described in
https://github.com/select2/select2/issues/3036#issuecomment-76321411.
[1]: http://superuser.com/q/78891/72528
[2]: https://developer.gnome.org/gtk3/stable/GtkIconView.html#GtkIconView-toggle-cursor-item
This fixes an issue where most keys would not trigger the search
in Firefox for Android. There were only a few keys which would
trigger `keyup`, such as space and enter (the search icon), but
they were not consistent. We know that they were being triggered
though, as you could type "new " (note the space) and it would
trigger a search, giving us all states that started with "new".
The problem is that Firefox for Android does not consistently
trigger `keyup` and `keydown` events when a keyboard is used. To
work around the issue, we are now using the `input` event in
replacement of the `keyup` event, which was used to trigger the
search. While this is not an actual `KeyboardEvent` in Chrome, and
lacks some of the important metadata such as `which`/`key` in
Firefox, it works for our implementation.
As the `input` event is not supported in older browsers, such as
those before Internet Explorer 9, we have to listen for both the
old `keyup` event and the new `input` event. As the `input` event
is always triggered before the `keyup` event, we unbind the `keyup`
event automatically to prevent searches from being triggered twice.
This solution was discovered in a blog post by Mathias Bynens at
https://mathiasbynens.be/notes/oninput.
**Note:** The ability to backspace in a blank text field on multiple
selects in order to remove the last selected item does not work in
Firefox for Android because the `keydown` event does not trigger
when the text field is empty. Users can still use the "x" icon
provided at the start of every selected option to achieve the same
effect.
This closes https://github.com/select2/select2/issues/2997.
This also fixes a possible issue where the `< 0` fallback would
not be used because the `minimumResultsForSearch` check would
always return false and never load in the module.
This closes https://github.com/select2/select2/pull/3077.
This fixes the fallback path for the `data-ajax-url` attribute on
elements. As this attribute was previously supported in Select2,
the attribute has been migrated to the new, nested format of the
url and triggers a deprecation warning when it is used. Because
of a fix to the `data-*` attribute parsing made in a9f6d64 that
allowed for nested attributes to be parsed correctly in modern
browsers under jQuery 1.x, the deprecation warning would be
triggered but the attribute would no longer actually be used.
This also fixes some of the `.data` calls to use the camel cased
version of the key instead of the dashed version, which is the
preferred key and will be enforced in future versions of jQuery
as the only way to access data attributes.
Now in situations where the `dataset` attribute is used by Select2,
it combines the results of both `$e.data()` and `e.dataset` when
generating the object containing all of the options. This will
the `dataset` fix to still be used, while also still relying on
jQuery to do additional parsing on any options that it can.
The `dataset` fix is now only used on jQuery 1.x, as that is the
only version of jQuery affected by the dash issue. This is done
using version number parsing on the `$.fn.jquery` property that is
defined by jQuery. As this property is not defined in Zepto and
many other jQuery compatible checks, we only include the fallback
if the property is available. This assumes that any jQuery
compatible libraries that are in use will not include the same dash
issue, which we believe is a safe assumption given that it did not
match the HTML `dataset` specification.
This also adds a few tests to ensure that the deprecated attributes
still continue to function.
This closes https://github.com/select2/select2/issues/3086.
This adds basic documentation explaining that there are compatibility
decorators for `<input type="text" />` support. This is not fully
compatible with all features and requires the use of an external
adapter like the `ArrayAdapter` or `AjaxAdapter` to provide a
reasonable way to query results.
This also triggers a warning if the adapter is used with a hidden
input, as the degraded functionality when there is no JavaScript
support should be discouraged.
This adds backwards compatibility back into Select2 for `<input />`
tags. The compatibility modules are only available in the full
version and will trigger a warning if a hidden input is being used.
With the new decorator, Select2 should support the basic operations
that it previously did, with the exception of completely overriding
the internal objects. As we no longer expose `data` as a writable
method, it is no longer possible to completely override the selected
data. The state is still managed internally, but in order to prevent
data corruption issues in the past, it is not exposed to the public.
Some small changes needed to be made to how Select2 was dynamically
generating new `<option>` tags, so now a method is called that can
be overridden. In the case of the new decorator, this method is
intercepted and handled without having to actually place the
`<option>` tags into the DOM.
The decorator is applied after all of the other defaults, as the
defaults are not given the current element.
There has only been limited testing with this decorator, primarily
using the `data` and `placeholder` options.
This closes https://github.com/select2/select2/issues/3022.
