1
0
mirror of synced 2024-11-30 08:36:03 +03:00
Commit Graph

291 Commits

Author SHA1 Message Date
Kevin Brown
473267404a Fix CSS text wrapping for single selects
Select2 previously had an issue displaying the text of long values
as it was not correctly wrapping the text.  This was because the
browser did not know that it couldn't wrap at whitespace, which
has been fixed.

Now Select2 should properly display an ellipsis for large text
values instead of overflowing.

This closes https://github.com/select2/select2/issues/2984.
2015-02-09 15:58:16 -05:00
Kevin Brown
0c0e2527fa Autofocus search field in multiple select
In a single select, the search field is automatically focused when
the select is opened. This also applied to multiple selects, but
this was causing issues because the container was automatically
focused when the dropdown was closed.

This makes a change such that the search field is automatically
focused when the dropdown is closed.

This closes https://github.com/select2/select2/issues/2995.
2015-02-09 15:43:46 -05:00
Kevin Brown
4dda5e7a74 Hide the search clear icon in webkit
The search box previously displayed a clear icon on the far right
side in webkit-based browsers, specifically Chrome and Safari. This
hides the clear icon in those browsers, and also fixes a slight
sizing issue, so it should no longer be displayed.

This also disables autocorrect, autocompleted, as well as a few
other automatic search corrections on the field, so mobile devices
should have a better experience.

This closes https://github.com/select2/select2/issues/3018.
2015-02-09 15:29:28 -05:00
th3byrdm4n
5a825e0cb3 IE7/8 Compatability fixes
[].indexOf() isn’t supported in old IE. Utilizing jQuery’s $.inArray()
allows for Select2 to work in IE compatibility mode.
2015-02-08 07:29:52 -10:00
Kevin Brown
1349579192 Respect -1 with minimumResultsForSearch
In past versions of Select2, supplying a value less than zero to
`minimumResultsForSearch` acted the same as providing a high value,
such as `Infinity`.  This corrects the regression by mapping anything
less than zero to the value `Infinity`.

This closes https://github.com/select2/select2/issues/2994.
2015-02-06 19:54:36 -05:00
Kevin Brown
0f7a37b2d6 Pass through non-strings in escapeMarkup
It is assumed that DOM elements or related objects will have been
escaped before they are passed back from templating functions. As
strings are typically blinding concatenated, like in our defaults,
it makes sense to escape the markup within them.

This is related to https://github.com/select2/select2/issues/3005.
2015-02-06 19:45:10 -05:00
Kevin Brown
1766e31447 Handle translations like template options
Translations will now be passed through `escapeMarkup` and injected
into the results messages as HTML just like the templating options
for the the results and selections.  This fixes the regression from
3.x where the old formatters always supported HTML.

This closes https://github.com/select2/select2/issues/3008.
2015-02-06 19:29:18 -05:00
Kevin Brown
78b6faf13e Check that allowClear is used with placeholder
The `allowClear` option may not work as intended if a placeholder
is not used. This is becaise the placeholder holds the value that
the `<select>` should be reset to when the `x` is hit.

An error is now properly raised in the console when Select2 detects
that the `allowClear` option is used without the `placeholder`
option.

This closes https://github.com/select2/select2/issues/3016.
2015-02-06 19:20:18 -05:00
Yanick Rochon
75aa419d0a Fixing errors in FR locale. Added missing pl/pt-BR locales in dist. 2015-02-06 03:49:06 -05:00
Kevin Brown
4c563a3d06 Add back ajax.transport support
This adds back the `ajax.transport` option, which allows anyone to
use their own AJAX backend. By default, `jQuery.ajax` is used as the
default transport backend.

**Breaking change:** Instead of taking `params` that contains a
`success` and `error` keys for the callback, two new callback
parameters are passed alongside of `params` that should be called
when the request succeeds or fails.

This closes https://github.com/select2/select2/issues/2987.
2015-01-29 09:15:02 -05:00
Kevin Brown
5a0f7f5518 Added back escapeMarkup
This is needed to escape any bad markup that is passed through
user-entered data. Users can prevent their markup from being
escaped by using a no-op `escapeMarkup` function.

This closes https://github.com/select2/select2/issues/2990.
2015-01-29 09:15:02 -05:00
Kevin Brown
01461813d8 Fixed missing jQuery import
Now we are using `jQuery.noConflict()` in tests, so it should be
slightly easier to detect when this happens next time. Tests just
need to be written for the component.

This closes https://github.com/select2/select2/issues/2985.
2015-01-29 09:15:02 -05:00
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
Kevin Brown
000653498f Fix z-index for modals
Select2 did not previously have a high enough `z-index` for it to
be displayed over modals. The `z-index` has been raised to 1051,
so now it should appear over the jQuery UI and Bootstrap modals.

This closes https://github.com/select2/select2/issues/2958.
2015-01-27 14:27:18 -05:00
Kevin Brown
65ff76c543 Fix dropdown search sizing
When Select2 is not used with a design that universally sets
`box-sizing: border-box` to elements, the search box previously
would take up more space than expected. This fixed the issue by
adding the `box-sizing` rule to the search box.

This closes https://github.com/select2/select2/issues/2978.
2015-01-27 14:09:52 -05:00
Kevin Brown
9906b2f434 Fixed dropdown for responsive widths
When we re-implemented support for responsive widths, through the
use of percentages, we never moved the support over to the dropdowns.
So the dropdowns generally were not large enough, and when resized
they never re-adjusted, and they didn't fully work as intended.

This fixes the issue by automatically resizing the dropdown whenever
it is repositioned, mainly to handle new scrollbars, which will
ensure that it is always the same width as the container.

This also adds a section to the examples for responsive design,
just like in the old documentation.

This closes https://github.com/select2/select2/issues/2949.
2015-01-27 14:07:44 -05:00
Kevin Brown
6488551374 Reverted changes to the scroll detection
This reverts the changes (from 3.5.x) to the scroll detection, so
Select2 will still reposition itself every time the window is
scrolled or resized. This has the benefit of fixing the issue when
the screen jumps if the dropdown is too high, which would previously
close the dropdown.

Select2 will also correctly set the positioning if it is pushed out
of the top of the viewport. Due to an unexpected bug, Select2 would
previously still display above the container, but would be styled
as if it were below it.

This closes https://github.com/select2/select2/issues/2961.
This closes https://github.com/select2/select2/issues/2956.
2015-01-22 17:35:08 -05:00
Kevin Brown
981c4065af Only trigger unselect for multiple
This fixes an issue where an `unselect` event would be incorrectly
triggered when the selected option was selected again in a single
select. This has been fixed now, so the even will only be triggered
for multiple selects. The `close` event will still be triggered
though, so the functionality will still remain the same to the user.

This closes https://github.com/select2/select2/issues/2959.
2015-01-22 17:16:12 -05:00
Kevin Brown
80bda0ad55 Fixed the selectOnClose option
The `selectOnClose` option did not work in production because we
were decorating the `dropdownAdapter` instead of the `resultsAdpater`
when automatically generating the adapters. This has now been fixed,
and the option should work without errors in production.

This also adds documentation for the `selectOnClose` option.

This closes https://github.com/select2/select2/issues/2953.
2015-01-22 15:19:45 -05:00
Kevin Brown
686f846fa5 Changed how the builds are done
This adds a check that triggers an error if Select2 was not able
to detect a copy of jQuery on the page. This should help users when
they are setting up Select2.

**Breaking change:** The full build no longer includes jQuery.
Previously, the full build included all requirements for Select2,
including jQuery, which meant that anyone looking for the optional
requirements had to possibly include multiple versions of jQuery
on their page. This means that anyone requiring Select2 to also
bundle jQuery will now need to include jQuery on their pages
alongside Select2. A copy of jQuery is included in the repository.

**Breaking change:** The AMD build of Select2 will now correctly
wrap the code in a `define` block. It will still create the named
blocks inside of the code, which should be valid in most AMD build
systems, so now Select2 is compatible with cases where the file
does not have the same name as the Select2 module name.

**Breaking change:** Select2 will re-use the AMD methods if they
are available on the page, but it will not longer leak the included
AMD loader to the global scope. The AMD methods will still be
available on the `jQuery.fn.select2.amd` namespace.

The `mock.js` test file has been renamed to `helpers.js` and will
handle the escalation of the `require` and `define` variables to
the global scope. It should be included in all test files, or the
tests will fail.

This closes https://github.com/select2/select2/issues/2946.
2015-01-22 14:49:39 -05:00
Kevin Brown
53c9d53166 Fix jQuery.noConflict compatibility
When `jQuery.noConflict` is called, the global `$` variable is not
defined. We cannot assume in the code that the variable is defined,
and instead should always make sure to import the `jquery` module
when we need jQuery.

This fixes all of the issues where we are assuming that `$` is
defined globally when we are not importing the module. This also
fixes the issues when defining the `jQuery.fn.select2.amd` modules
where we were always attaching to the `$` object instead of the
`jQuery` object.

This closes https://github.com/select2/select2/issues/2947.
2015-01-21 19:56:06 -05:00
Kevin Brown
d81886e5de Trigger the unselect event when clearing placeholder
In the past, Select2 triggered the `select2-clearing` event when
clearing the placeholder. This has been switched to the `unselect`
event which is now triggered whenever the placeholder is cleared.
The placeholder can also be prevented if the `unselecting` event
is prevented.

This will also trigger the event when deleting every option from
the multiple select, so it is possible for the `unselecting` event
to be triggered multiple times when clearing a multiple select.

This adds tests to ensure that the `allowClear` option always works.

This closes https://github.com/select2/select2/issues/2954.
2015-01-21 19:11:07 -05:00
Kevin Brown
5b4e1eab42 Added a check for the results key in AJAX responses
This should prevent users from running into unexpected errors when
they do not return an object with the `results` key containing an
array.

This closes https://github.com/select2/select2/issues/2950.
2015-01-21 16:36:23 -05:00
fallenby
0fe54b6d3b Hide element if template returns a false-like value
This allows you to hide elements when using the template% formatting functions.

Signed-off-by: Kevin Brown <kevin@kevinbrown.in>
2015-01-17 22:14:12 -05:00
Tim
c318cde916 Added dutch translations
nl.js

Signed-off-by: Kevin Brown <kevin@kevinbrown.in>
2015-01-17 22:11:17 -05:00
Kevin Brown
ffb58a1be8 Fixed Russian translation
This fixes a mistake made when migrating the translation.
This closes https://github.com/select2/select2/issues/2933.
2015-01-17 22:05:48 -05:00
Kevin Brown
1b46e8ab3e Improve the default language chain
If the language that is passed in through the options is just a
string, like "en-US" or "pt-BR", Select2 will now try to load the
base language along with the requested language and "en". So
requesting "pt-BR" will try to load "pt-BR", "pt", and "en".

This also catches errors and triggers a warning about not being
able to load the file. This should be a more user friendly error,
and it fixes the problem where Select2 would completely fail to
initialize if a language could not be found.

This closes https://github.com/select2/select2/issues/2934.
2015-01-17 21:56:58 -05:00
Kevin Brown
2f4cc19cd9 If a named style can't be determined, return null
Previously this would return `style` if it couldn't be resolved and
the `style` attribute on the element is set for some reason. Now it
will return `null`, because it tried to resolve the width but was
not able to. This will allow it to fall back to `element` by default,
or not set the width at all.

This closes https://github.com/select2/select2/issues/2935.
2015-01-17 21:43:38 -05:00
Kevin Brown
f427451853 Expose the defaults
This exposes the default options for Select2 as
`$.fn.select2.defaults`. A default option can be set using the
`set(key, val)` option which is available. The key should use the
same formatting as the HTML data attributes.

This also adds some documentation about it.
2015-01-17 21:27:53 -05:00
Kevin Brown
d6a83ea026 Pull query and initSelection out to compat modules
This also adds more documentation and corrects the release notes
for these breaking changes. These modules will now only be included
in the full builds of Select2, which has been noted in a few places.
2015-01-17 20:47:52 -05:00
Kevin Brown
b43656c13c Added basic accessibility tests
This adds basic tests to ensure that the selection is accessible by
all users. This checks for common attributes, ensuring that the
container is always keyboard accessible and follows ARIA guidelines.

This also changes the base selection to create a common element so
we don't need to repeat attributes and such across multiple selection
containers.
2015-01-14 22:54:19 -05:00
Kevin Brown
2a7ae0ea9c Add backwards compatibility with query option
This adds backwards compatibility with the `query` option so it
automatically patches the `DataAdapter.query` function. The only
major difference between the methods is the call signature, which
has now moved the callback out of the parameters and into the second
argument.

This also adds tests that verify that the old query functions should
work as expected.
2015-01-14 21:24:09 -05:00
Kevin Brown
e04188c85a Added backwards compatibility for initSelection
Now if the old `initSelection` method is used, a warning will be
triggered in the console informing the user that it has now been
changed to `DataAdapter.current`, and they should create a custom
data adapter instead. We will still only call `initSelection` once,
and then default back to the old data adapter for calls after that.
This allows for mostly transparent support between versions.

This adds tests to ensure that `initSelection` operates the same as
it previously did, but now patches the `current` method of the
default data adapter.
2015-01-14 21:24:08 -05:00
Kevin Brown
286b83898f Documented the removal of initSelection and query
This adds detailed docs explaining how you can convert the old
implementations of `query` and `initSelection` into a custom data
adapter using the `current` and `query` methods provided there.
Examples are included that should make it considerably easier to
handle.
2015-01-14 21:24:08 -05:00
Kevin Brown
8d35d5e416 Fixed opening issue
This fixes an issue where the data set would not be queried when
the dropdown was opened.
2015-01-13 19:09:04 -05:00
Kevin Brown
28f9cae5d7 Added some more jQuery events
This adds the `select` and `unselect` events so users can still
hook into them from their jQuery plugins.

This also modifies the core `trigger` to fire pre-events that can
be canceled for the `open`, `close`, `select`, and `unselect`
events. Users implementing these events who need to handle cases
where the event has been prevented should check `args.prevented`,
where `args` is the object that was included for arguments when
triggering the internal event.
2015-01-13 18:28:21 -05:00
Zubair
7515fa7f46 only verify when maximumSelectionCount is greater than 0 and add tests 2015-01-13 13:00:16 -05:00
Zubair
25dade52e5 rebuild dist. Fixed space 2015-01-13 13:00:16 -05:00
Zubair
e18fa1b5b8 fix callback using this.current.
add example.
2015-01-13 13:00:16 -05:00
Zubair
2bdb5dbdae add maximum selection length option 2015-01-13 13:00:16 -05:00
Kevin Brown
86b4a5d8e2 Added amdBase and amdLanguageBase options
This should allow those using their own build systems to
automatically load in translations. In the future, the `amdBase`
option may be used to optionally load some components of Select2.

As Select2 cannot know what the base directory is, it currently
has to load in all of the optional components in the default build.
By allowing users to set their own base, it will allow us to know
the base to load files from, which makes it easier to use the
`require` function to optionally load them.

This fixes https://github.com/select2/select2/issues/2899.
2015-01-11 21:59:27 -05:00
Kevin Brown
584d3b48a2 Added selectOnClose
`selectOnClose` is a new option which works very much like the old
`selectOnBlur` option. When the `close` event is triggered, the
highlighted result is automatically selected. This is useful for
single selects, which is where it is designed to be used, but it
can also be used on multiple selects.

This also adds tests to verify that this works in the future.

During the creation of the test, we noticed that we were missing a
mock container that could be used for triggering events. One was
created and a general mock JS file was created to hold any future
mocks for tests.
2015-01-11 21:47:17 -05:00
Kevin Brown
af1f35176b Added back the width option
In past versions of Select2, the `width` option could be used to
tell Select2 how to determine the width of the container generated
by Select2.

**Breaking change:** The default value for the `width` option has
been changed from `copy` to `resolve.`

**Breaking change:** The old option called `copy` has been renamed
to `style` to better reflect what the width is generated from.

This fixes https://github.com/select2/select2/pull/2090.
This fixes https://github.com/select2/select2/issues/2911.
2015-01-11 18:00:48 -05:00
lazything
a4d45d4f17 Update dist 2015-01-10 16:27:22 +02:00
Kevin Brown
7f17291932 Fix support for deep nesting
While deep nesting will not work on a standard `<select>`, we can
emulate it through data objects still, and just handle the display
of the data in the results.

This also means that the horrific deep-nested CSS is back to handle
the padding. I hope that will get fixed over time.

This also fixes one of the performance issues with adding array
data, as options are added at the very end instead of one by one.
2015-01-09 20:50:06 -05:00
Kevin Brown
a6c4215976 Fixed multiple selection placeholders
Due to a change in 7edf0e3ebe that
made the rendered selection take up the full width of the selection
container, the placeholder was not being automatically displayed.
The calculations were always turning out negative, which has been
fixed by not trying to automatically calculate the best possible
width.
2015-01-09 14:08:31 -05:00
Kevin Brown
1191d4a3bb Fixed overflow when triggering results messages
Because of the change made previously to make events global, any
time a result message was triggered there would be a stack overflow.
This was because we were re-triggering the event locally if it
happened on a global level, which would start the loop.

This has been fixed so the event is never caught locally, but
instead uses the global handler.
2015-01-09 12:46:21 -05:00
Kevin Brown
7edf0e3ebe Style clear icon in multiple selects
The `AllowClear` decorator appears to work fine with multiple
selects, so we've chosen to remove remove it. This adds some
styling and fixes the check so it all works as expected.

This closes https://github.com/select2/select2/issues/2903.
2015-01-09 11:03:31 -05:00
Kevin Brown
fe1374fd11 Hide the x when the container is disabled
This fixes an issue where the `x` in multiple selects (visible next
to the option) would be visible even if the container was disabled.
Because it was still accepting events as well, this would cause the
underlying data to be changed, even though it was disabled. We now
hide the icon using CSS so this issue doesn't occur.

The same applies to the `x` for clearing a placeholder.

https://github.com/select2/select2/issues/2903
2015-01-09 10:47:56 -05:00
Kevin Brown
751fc63169 Expose createTag as an option
This is a replacement for the old `createSearchChoice` method which
allowed tags to be dynamically created with a custom data object.
2015-01-09 10:30:56 -05:00
Kevin Brown
024d41b412 Normalize internal select/unselect events
Also pull the logic for automatically closing the dropdown into the
dropdown adapter, taking it out of the core.

The `selected` and `unselected` events are now `select` and
`unselect`, which is what many of the other adapters were expecting
them to be.

Some tests for placeholders have been added.
2015-01-09 10:05:44 -05:00
Kevin Brown
64cb528f62 Set up a public event relay
Now Select2 can fire jQuery events that will match the corresponding
internal events. The `open` and `close` events are now publicly
accessible.

The selection adapter was chosen because it is the least likely to
be moved, but handles the most common events. This `EventRelay`
decorator should theoretically be able to decorate any of the
adapters, as they all have the `bind` method that it needs.
2015-01-08 11:44:09 -05:00
Kevin Brown
bba967ba21 Use the star event for internal binding
The star event will allow us to relay any custom events as well as
the ones used internally by Select2. This also makes it much
easier to start triggering events in general, as we don't need to
relay it in the core anymore.

A module has been created for the jQuery-facing events, and the
release announcement has been updated to mention the event name
changes.

This also adds some documentation about the public events.
2015-01-08 10:40:13 -05:00
Kevin Brown
68286e3cff Search focus should also happen in a timeout
For the dropdown search on single select instances, the search
focus should happen in a `setTimeout` call. This is because many
browsers trigger the element focus on `click`, so our original call
to `$search.focus` will essentially be ignored. By also focusing
it in a timeout, this will delay the call to `focus` so the browser
will no longer take it back.

We do not have this issue for multiple select instances, as they
trigger the `open` event on `click`, instead of using `mousedown`.

This fixes https://github.com/select2/select2/issues/2900.
2015-01-08 10:10:23 -05:00
Kevin Brown
05cbaf7bf7 Universally use the object query return
There was a plan to universally use an array as the return from
query methods, but now that we've realized pagination and extra
things are impossible without it, we're going back to the return
object. Anyone looking to migrate their data should be returning
an object with the key `results` containing what they previously
returned.

This should fix https://github.com/select2/select2/issues/2898
2015-01-07 21:11:32 -05:00
Kevin Brown
063859160d Add a few translations, label the others 2015-01-07 20:39:29 -05:00
Kevin Brown
e111ea0420 Added a few new translations
Also fixed the JSHint issues in the new Ukranian translation.
2015-01-07 20:11:58 -05:00
Kevin Brown
f8fdcb6fa5 Added support for tokenization
This brings up both the `tokenizer` and `tokenSeparators` options.
2015-01-06 20:03:12 -05:00
Kevin Brown
938993302f Fixed SASS error
This fixes the SASS error caused by the `&[dir="rtl"]` selector in
the `_single.scss` and `_multiple.scss` files. We were expecting
these files to be nested within the `.select-container` class, which
would have made this a non-error as the `&` would refer to the
`.select2-container` class that was wrapping the `@import`.

This moves the `@import` statements into the `.select2-container`
class, so this no longer triggers an error in the Ruby version of
SASS.

This closes https://github.com/select2/select2/issues/2896
2015-01-06 17:54:33 -05:00
Kevin Brown
ed24a51ea3 Updated docs to use the Select2 GitHub organization
Documentation will now be at https://select2.github.io
2015-01-02 21:12:41 -05:00
Kevin Brown
ad94b6faba Added jQuery.mousewheel support
jQuery.mousewheel will allow us to prevent the dropdown from
automatically closing when the user scrolls to the end of the list.
It is automatically bundled in the full versions of Select2 and
we don't require that it is included in order for Select2 to work.

jQuery.mousewheel was taken directly from the source repository
using the commit at

cc2c5d73ae
2015-01-02 20:32:14 -05:00
Kevin Brown
09e3a76bf9 Added pagination support for AJAX results
I'm still not quite sure how this should be handled for the general
case, but for the special case we have this for infinite scrolling,
only on AJAX data.
2015-01-02 19:58:09 -05:00
Kevin Brown
f1e86470ca Clone the options for group elements
This will always clone the options that are passed in when
initializing Select2 on multiple objects (like `$("select")`) so
it doesn't always assume that the configuration is the exact same.
This prevents any reference-based tricks for modifying the data
within Select2, but some would look at that as an upside.
2015-01-02 18:15:59 -05:00
Kevin Brown
12f7ed93f8 Added more migration information
The documentation for templates still needs to be created.

A warning is now generated in the console for applications using
the previous data attributes that have been migrated.
2014-12-27 21:47:18 -05:00
Kevin Brown
e7c2c70d1a Added RTL support to Select2
This works in the same way as the `lang` option, which pulls
directly from the `dir` property on DOM nodes.
2014-12-17 22:08:58 -05:00
Kevin Brown
0bc73941fe Support duplicate options
Now that the data objects have the `element` property, we can test
to make sure it's a DOM element and then use it for selecting the
option. This allows us to select multiple options with the same id,
as well as handle cases where that is already happening.

You cannot use `$e.val()` to select two options with the same id,
as jQuery will reject it, but you can set the second option to
`.selected = true`, which is supported.
2014-12-17 20:36:06 -05:00
Kevin Brown
fe136088f6 Fixed string to object conversion 2014-12-17 19:39:12 -05:00
Kevin Brown
ea41b627dc IE fixes and alt-arrow support
alt-down/up is the standard way of opening a select when using a
screen reader. This also fixes the gradient in IE, so now it
displays the right colors. Also added a note about Placeholders.js,
so the placeholders on multi-select boxes will work in IE 9 and
below.
2014-12-17 19:06:13 -05:00
Kevin Brown
358306ac8c Respect the disabled attribute
Added a disabled state for Select2. This will correctly listen to
property changes (so when the disabled property is changed) and
update the state of Select2 to reflect it.

Added a utility function to find a method to a different context.
2014-12-16 22:44:11 -05:00
Kevin Brown
1e44ab7ee1 Added the element reference in the data
This also fixes `_normalizeItem` for cases where `text` doesn't
exist, so it doesn't clobber the item.
2014-12-16 20:51:35 -05:00
Kevin Brown
33809f1fef Added some translations 2014-12-16 20:45:44 -05:00
Kevin Brown
096d55b64d Fixed backspace on multiple selects 2014-12-11 18:10:46 -05:00
Kevin Brown
3ff78d8145 Added back select2("enable")
This also adds a console warning if the `enable` or `val` method is
called.
2014-12-11 17:42:05 -05:00
Kevin Brown
100015b205 Added back select2('val')
With the recent changes to how Select2 works internally, this really
isn't needed. This has been added to make the migration path
easier, and it just internally calls `val` on the underlying select
element. The only difference is that the `val` function will now
convert any non-string elements to strings.

The second argument (`triggerChange`) has not been migrated, as
Select2 now internally relies on the `change` event.

**Note:** As the old `initSelection` method has not been migrated,
it is not possible to set the `val` on remote data sources where
the value has not previously been selected.
2014-12-11 17:11:38 -05:00
Kevin Brown
395e06aff5 Backspace unselects item in multiple selects
The backspace key now behaves very similar to how it does in other
multiple select boxes, such as the one that Stack Exchange uses.
When the user presses the backspace key, the last selected option
is unselected and the search box is filled with the text of the
option.
2014-12-10 19:19:48 -05:00
Kevin Brown
0de516f17a Add minimumResultsForSearch 2014-12-10 18:46:05 -05:00
Kevin Brown
caf4ad73d7 Allow for custom sorting functions
This adds the `sorter` function, which works in the same way as the
old `sortResults` function.
2014-12-10 18:22:25 -05:00
Kevin Brown
ec1bd3387b Added lang attribute support
Select2 will now detect the language based on the `lang` attribute
of the `<select>` element or any parent elements.
2014-12-10 18:09:00 -05:00
Kevin Brown
14db3fc801 Support data-* attributes for configuration
The documentation is included, along with a few tests, which
explains the general rules for how it is parsed.
2014-12-10 15:23:39 -05:00
Kevin Brown
f6625d2347 Added dropdownParent
`dropdownParent` controls the location of the dropdown when it is
automatically added to the DOM. By default, this is the body
element but it can be modified based on where the user needs it.
2014-12-09 22:12:07 -05:00
Kevin Brown
4cdda7e156 Finish off the incomplete options documentation
The documentation is not completely finished, but now we have no
placeholders waiting to be completed.
2014-12-09 20:30:57 -05:00
Kevin Brown
f0017c024d Added support for a click mask
In past versions of Select2, a mask was used to detect clicks
outside of the dropdown. While this works with high accuracy, and
avoid many of the click issues we had with modals, it is no longer
the default close handler for Select2. It blocks any features on
the container from working without a second click, and introduces
odd edge cases that we cannot easily handle.
2014-12-05 22:44:41 -05:00
Kevin Brown
ce38cd5b9c Allow the dropdown to point up
Up until now, the container could only have a dropdown that was
displayed below the container. While this worked well, there are
some cases where the dropdown should be displayed above the
container. Most notably, this is when the conatainer is displayed
towards the bottom of the page, and displaying the dropdown would
cause the page to be extended. Because we close the dropdown
when the page is scrolled, the user would not be able to access any
options that were displayed outside of the viewpoint.

Because of the order that events are fired, we attach the handlers
for repositioning the dropdown after results are displayed when the
container is opened for the first time.  This allows it to be
registered after the results container registers their events, so
the dropdown is repositioned after the results have been displayed.

The logic for determining the direction that the dropdown will be
shown in is very similar to the positioning code used in
Select2 3.x. Unlike previous versions of Select2, a class is used
to indicate the direction of the dropdown, even if it is displaying
below the container.

The themes provided with Select2 have been updated to correctly
render the dropdown in both directions.
2014-12-05 20:09:42 -05:00
Kevin Brown
fda973c34f Started adding more translations 2014-11-26 23:19:04 -05:00
Kevin Brown
07575f051c Automatically close on scroll
This now matches how the browser works, where the dropdown is
closed when the window scrolls.

The arrow was also covering the clear placeholder icon, this has
now been fixed and the clear icon is now placed correctly.
2014-11-26 22:30:31 -05:00
Kevin Brown
e3647051de Added maximumInputLength support 2014-11-26 21:52:49 -05:00
Kevin Brown
7fc195f70d Fix hiding search
When the dropdown is in the dropdown that is attached to the body,
the call to `show` causes `display: inline` to be set directly on
the search container. This causes rendering issues, so this change
uses a class instead of calling `show` and `hide` directly.

This is most likely a jQuery bug of some form, as it only happens
when using the dropdown that is attached to the body.
2014-11-26 20:39:52 -05:00
Kevin Brown
56d5778590 Finished off tests for tags
This also adds back the ability for tags to return `null` in order
for no tag to be added to the results.
2014-11-26 19:53:15 -05:00
Kevin Brown
a4af105a6e Fixed the default translations
Previously the default translations would break for custom AMD
builds. This fixes it so it does not rely on a hard-coded import
path.
2014-11-25 16:09:52 -05:00
Kevin Brown
81db43fa99 Extracted the original positioning out
With this change, any instances overriding the dropdown is
required to decorate it with the positioning module.
2014-11-25 15:59:35 -05:00
Kevin Brown
6a0c002f94 Add a module for attaching the dropdown to the body
In Select2 3.x, the dropdown is attached to the body element and
it is floated above all other elements.

In Select2 4.x, the dropdown is attached directly to the Select2
container, which allows us to skip any special placing logic. This
happens to be how Chosen currently does it, and it prevents us
from having the dropdown display up, as well as a few other strange
issues that can't be prevented.

This new module will most likely become the default, as it matches
the functionality of Select2 3.x and has quite a few advantages.
The other positioning code will need to be broken out into a
separate module in the future.
2014-11-25 15:39:42 -05:00
Kevin Brown
31c09315c8 Move positioning into the components
The main container should not need to position the individual
components. This makes it easier for components to override where
they should be placed, such as adding the dropdown outside of the
container.
2014-11-25 14:19:07 -05:00
Kevin Brown
be3414f6fe Moved the body click handlers out
This should allow us to start working on the body mask handler,
and make future implementations easier to work with.
2014-11-25 14:03:21 -05:00
Kevin Brown
85593de1fa Fixed bug when destroying Select2
When destroying Select2, an error could be raised while destroying
the selection container. This was because the destroy handler was
relying on the container id being present.

The old functionality has been restored where Select2 will destroy
itself when it is initialized again.
2014-11-25 13:39:46 -05:00
Kevin Brown
ac5d584f3d Added the arrow for the dropdown 2014-11-24 21:33:22 -05:00
Kevin Brown
ffed37013d Added back the allowClear option 2014-11-24 20:43:15 -05:00
Kevin Brown
dafa99bf40 Working on the classic theme 2014-11-24 20:08:24 -05:00
Kevin Brown
e686bce9d0 Converted classic theme to BEM
This should be the last of the changes.
2014-11-24 19:11:02 -05:00
Kevin Brown
3e54fc97e5 Finish the core switch to BEM
This switches all of the dropdown components to use BEM.
2014-11-24 18:59:19 -05:00
Kevin Brown
8cb074ccef Finished switching main container to BEM 2014-11-24 18:38:58 -05:00
Kevin Brown
7933eb77c1 Switch the multiple selection container
This switches the container to use BEM for the class naming.
2014-11-24 18:30:58 -05:00
Kevin Brown
971422f92e Start the switch to BEM
This is inspired by https://github.com/ivaynberg/select2/issues/2826
and starts the general transition to using selectors with a lower
specificity. This should make it considerably easier to override
the styles in the long run.

Unfortunately libsass does not support the SASS 3.3 style for BEM
where we can just use `&__m` for defining sub-modules. For now we
are still using a limited amount of nesting, but nowhere near as
much as we did in the past.
2014-11-24 18:11:03 -05:00
Kevin Brown
f1c02db189 Automatically resize the search box
Now the search box is automatically resized for placeholders to
fit the available space, so we don't need to worry about the
placeholder not being visible. When the placeholder doesn't need
to be visible, the size of the search box is determined based on
the length of the current search term.
2014-11-22 20:32:25 -05:00
Kevin Brown
217cd4cfd0 Added inline searching for multiple selects
This adds a search box to the main container for multiple select
boxes, similar to the what the old version had. This can still be
swapped out such that the search box displays above the results
like it previously did.

The placeholder for multiple selects will also now use the input
attribute of the search box instead of generating a custom element.

This also changes the selector for the search container to
`.select2-search`, which is consistent with the old class and
reduces the complexity of the selectors.

This fixes an issue with how decorators worked, where the constructor
from the parent class would clobber the custom constructor that is
generated for the new decorated class. This has been fixed by
excluding the constructor from the list of fields which are
transferred when decorating classes.
2014-11-22 19:21:46 -05:00
Kevin Brown
2bec6e2579 Automatically strip diacritics
This adds a dictionary for converting diacritics to a normalized
representation. This dictionary is used in the default matcher.

The code for stripping the diacritics was pulled from the current
implementation in Select2 3.x.
2014-11-19 18:12:59 -05:00
Kevin Brown
5ec201ca30 Built out the translations
This migrates over the required English translations under their
new names.

The "Searching" message has also been adjusted to use "Searching..."
instead of "Loading more results...", which is what it used to
say sometimes.

This also changes the AJAX handler to call `abort` when needed.
2014-11-19 17:48:46 -05:00
Kevin Brown
7e6782d580 Display a loading message when searching
Now when searching, a loading message is prepended to the top of
the results. This replaces the old spinner image and allows for it
to be translated across different languages.

The loading message can be styled differently and is passed
through the results formatters.
2014-11-19 17:22:37 -05:00
Kevin Brown
28c56e7885 Better accessibility for multiple select boxes 2014-11-19 15:50:53 -05:00
Kevin Brown
cee8c18c23 Change how the results are highlighted
Previously, a result was no longer highlighted when the mouse was
no longer over it. While this was useful for resetting the
highlight automatically, we started doing this when a new result
was highlighted to make sure that we never had multiple options
highlighted.

Now, a result will always be highlighted until the highlight is
removed when the next result is highlighted. While this shouldn't
affect many users, it is closer to how native select boxes work.
This also allows users using keyboard navigation to jump between
mouse and keyboard navigation without the highlight reseting to
the top of the results.
2014-11-19 14:29:28 -05:00
Kevin Brown
849a9c7a32 Started work on the classic theme
Some people like the old theme, so we're going to also include that
one as well as the easier-to-extend flat theme.
2014-11-19 14:26:52 -05:00
Kevin Brown
a2766b7ed6 Added destroy method
Now Select2 supports destroying itself, and all elements that it
creates.
2014-11-13 18:36:40 -05:00
Kevin Brown
10536370de Add support for initializing tags
This adds backwards compatibility for the old tags.
2014-11-07 20:31:27 -05:00
Kevin Brown
5535f072e1 Focus the search upon opening 2014-11-07 20:16:59 -05:00
Kevin Brown
07e82d6be8 Automatically create options on select 2014-11-07 20:13:59 -05:00
Kevin Brown
d411a0fa76 Fixed default selections for arrays 2014-11-07 19:53:50 -05:00
Kevin Brown
e3deb3ae03 Remove jQuery from building the options
This fixes many of the speed issues the results had when working
with large data sets. jQuery has been completely dropped, with the
exception of setting the data, which does not require a jQuery
object but instead works directly with the DOM. This does not
include options with children, which still uses jQuery to deal
with the nested objects.

This only works with IE 8+, which is fine.
2014-11-07 19:37:07 -05:00
Kevin Brown
8ecc35d504 Fix caching when querying
This fixes caching when querying, so the data object no longer
needs to be completely regenerated whenever the `<option>` is
queried.

While this does not fix the speed issues on the first opening of
the instance, it does fix the speed issues during searching.
2014-11-07 19:07:01 -05:00
Kevin Brown
05ddbec1a7 Improve data array speeds
This improves the speeds of creating the `<option>` tags for array
data. By creating the HTML ahead of time and putting it into an
`<option>` element before passing it to jQuery, it cuts down on the
time it takes for jQuery to process the HTML string and convert it
into DOM elements. This proved to be incredibly slow.

This also changes the `item` function to return early when the
data exists. The `$e.data` call has also been switched to a
`$.data` call, which doesn't need to check the DOM to see if the
data attributes already exist. This cuts down on a bit of wasted
time, as the `data` key should never be present in the DOM, and it
should be ignored if it is.
2014-11-07 11:17:37 -05:00
Kevin Brown
56dbbf8cdb Improve option generate speed
Now the options are mostly generated by hand before being passed
off to jQuery for templating. This fixes much of the speed issues
we had when they were entirely being generated through jQuery.
2014-11-06 13:40:36 -05:00
Kevin Brown
8158e151ff Added test to make sure the options are generated 2014-11-06 12:12:43 -05:00
Kevin Brown
8ea23610f1 Convert array data to options immediately
This converts individual objects passed in through the `array`
parameter to `<option>` tags when Select2 is initialized. This
removes a lot of duplicate code from the `ArrayAdapter`, and keeps
everything closer to the native `<select>` element.

This introduces a breaking change from previous versions of Select2,
where the initial value for array data was blank, even if a blank
option was not present in the original array of objects. Now the
first object passed in will be selected by default, following the
behavior of a standard `<select>` element.

This breaking change does not affect `<select multiple="multiple">`
elements, which by default have no selection.
2014-11-06 12:05:12 -05:00
Kevin Brown
c7e8f81595 Added Spanish translation and fixed the example 2014-11-05 11:25:41 -05:00
Kevin Brown
ed98443d47 Added matcher example and reworked compat
The matcher example now matches the old matcher example, and the
compatibility module has been turned into a function decorator
instead of a class decorator.
2014-11-05 11:03:53 -05:00
Kevin Brown
0bc4832995 Better infinite scroll
Only show the "No results found" message when there are no results
visible in the list. This avoid issues when loading more data, and
it returns no results.

Only try to see if the load more button is visible if it is present
in the DOM. This prevents making continuous requests when there are
no more results.
2014-11-03 19:24:29 -05:00
Kevin Brown
5e3b63289c Added infinite scrolling support for AJAX 2014-11-03 19:10:36 -05:00
Kevin Brown
91cecd55ed Handle minimumInputLength 2014-11-01 22:59:59 -04:00
Kevin Brown
8b7924fc72 Templating for selections 2014-11-01 22:12:21 -04:00
Kevin Brown
a3fa516761 Added basic templating to results 2014-11-01 21:57:14 -04:00
Kevin Brown
be4d091451 Working on remote data sets
This starts work on the example, which currently uses the GitHub
API.

The `ajax.delay` option has been added that allows for debouncing
requests made within a certain number of milliseconds.
2014-11-01 21:36:36 -04:00
Kevin Brown
6d2b462e2b Better key event handling 2014-11-01 21:04:31 -04:00
Kevin Brown
e16c505c25 Move to a central key handler
This allows for any control to emit key events, and for the Select2
instance to handle them. So now the search box will allow for
results to be scrolled and selected, bringing back the old expected
functionality. This also stops triggering new queries when the
arrow keys are pressed.

The container will also be automatically focused when the dropdown
is closed, which is consistent with the old Select2.

The results will no longer be queried on initialization, but
instead will be queried when the dropdown is opened. This is more
consistent with the previous version of Select2.

The search box will now be cleared when the dropdown is closed.
2014-11-01 20:35:23 -04:00
Kevin Brown
3b575ad92f Register the click handler in the container
This shouldn't be in the core, it's much easier to override things
in the container.
2014-11-01 19:36:02 -04:00
Kevin Brown
130358e8ae Set up the click handler for closing
Now the dropdown will automatically be closed when the user clicks
outside of it.
2014-11-01 19:29:07 -04:00
Kevin Brown
f8ca597f02 Move all of the event binding into separate methods
This should make it easier to override in subclasses.
2014-11-01 19:05:08 -04:00
Kevin Brown
47d0bc4fe1 Allow the position of the tag to be customized. 2014-11-01 18:40:06 -04:00
Kevin Brown
8bdd83c44f Better support for tagging
This removes the special case for `<select>` elements and instead
handles everything tagging related within the `Tags` decorator.
2014-11-01 17:49:53 -04:00
Kevin Brown
b87a4a55e4 Fix automatically hiding the placeholder
The placeholder will not only be automatically hidden if the
results adapter was not already overridden. This will allow users
to override the results adapter to now hide the placeholder, if
they do not want that functionality.
2014-11-01 17:27:30 -04:00
Kevin Brown
e57e0b1870 Added decorator to remove the placeholder object
This will remove the placeholder object from the results list.
2014-11-01 17:21:46 -04:00
Kevin Brown
09a0bb89b8 Move placing the sections into methods
This allows them to be overridden, allowing for things like
attaching the dropdown to a different part of the DOM.

The id is also now generated in a function that can be overridden.
2014-11-01 17:08:59 -04:00
Kevin Brown
959b96eca6 Started work on the "No results found" message 2014-11-01 14:20:51 -04:00
Kevin Brown
9bb993cee9 Added Translation object
This continues the work to get translations built into Select2.
2014-10-31 23:03:03 -04:00
Kevin Brown
20fcaa4449 Start working on translations
This adds a custom r.js build for i18n, which processes each JS
file in the `select2/i18n` directory and builds it.

So far only the "No results found" translation has been added.
2014-10-31 22:24:59 -04:00
Kevin Brown
65875bf8e7 Better handle AMD across files
Now that `define` and `require` are never made public, we have to
build everything to support `$.fn.select2.amd` while also working
with other AMD loaders.
2014-10-31 21:13:43 -04:00
Kevin Brown
afbf30d09a Wrap JS
This will prevent leaking variables, and will remove the possibility
of Select2 not working well with other plugins which support
AMD loaders. The `define` and `require` methods are now aliased
under `$.Select2.amd` for use inside additional files, such as
translations.
2014-10-31 20:15:17 -04:00
Kevin Brown
8e70642b87 Lint the Gruntfile 2014-10-31 19:12:27 -04:00
Kevin Brown
5dd7df33bb Allow programmatic access of Select2 2014-10-21 21:44:01 -04:00
Kevin Brown
5dd5ad93a6 Ensure that the highlighted result is visible
When opening the dropdown, the highlighted result will not always
be scrolled into view if it isn't already.
2014-10-21 21:44:01 -04:00
Kevin Brown
559a93bcb6 Added basic implementation of tags
Tags no longer takes an array, as pre-existing tags should already
exist as options in the data adapter.  A compatibility module will
later be added to convert tag data that is passed in to array data.

Tags allow for users to enter their own options, which will be
added to the beginning of the results list.
2014-10-21 21:44:01 -04:00
Kevin Brown
9e130956fc Better compatibility with array data
When using array data, and an option is selected, the data that is
attached to the DOM element will be run through `item` and should
have any private, automatically generated attributes added and
merged with it.
2014-10-21 21:44:00 -04:00
Kevin Brown
72ae0da879 Only generate result ids when the container has an id 2014-10-21 21:44:00 -04:00