Fixed data-ajax-url
fallback
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 commit is contained in:
parent
3630385cf7
commit
55f995ea21
8 changed files with 100 additions and 28 deletions
18
dist/js/select2.amd.full.js
vendored
18
dist/js/select2.amd.full.js
vendored
|
@ -4103,7 +4103,7 @@ define('select2/options',[
|
|||
$e.prop('disabled', this.options.disabled);
|
||||
$e.prop('multiple', this.options.multiple);
|
||||
|
||||
if ($e.data('select2-tags')) {
|
||||
if ($e.data('select2Tags')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-select2-tags` attribute has been changed to ' +
|
||||
|
@ -4112,11 +4112,11 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('data', $e.data('select2-tags'));
|
||||
$e.data('data', $e.data('select2Tags'));
|
||||
$e.data('tags', true);
|
||||
}
|
||||
|
||||
if ($e.data('ajax-url')) {
|
||||
if ($e.data('ajaxUrl')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-ajax-url` attribute has been changed to ' +
|
||||
|
@ -4125,12 +4125,20 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('ajax--url', $e.data('ajax-url'));
|
||||
$e.data('ajax-Url', $e.data('ajaxUrl'));
|
||||
}
|
||||
|
||||
var dataset = {};
|
||||
|
||||
// Prefer the element's `dataset` attribute if it exists
|
||||
// jQuery 1.x does not correctly handle data attributes with multiple dashes
|
||||
var data = $.extend(true, {}, $e[0].dataset || $e.data());
|
||||
if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
|
||||
dataset = $.extend(true, {}, $e[0].dataset, $e.data());
|
||||
} else {
|
||||
dataset = $e.data();
|
||||
}
|
||||
|
||||
var data = $.extend(true, {}, dataset);
|
||||
|
||||
data = Utils._convertData(data);
|
||||
|
||||
|
|
18
dist/js/select2.amd.js
vendored
18
dist/js/select2.amd.js
vendored
|
@ -4103,7 +4103,7 @@ define('select2/options',[
|
|||
$e.prop('disabled', this.options.disabled);
|
||||
$e.prop('multiple', this.options.multiple);
|
||||
|
||||
if ($e.data('select2-tags')) {
|
||||
if ($e.data('select2Tags')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-select2-tags` attribute has been changed to ' +
|
||||
|
@ -4112,11 +4112,11 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('data', $e.data('select2-tags'));
|
||||
$e.data('data', $e.data('select2Tags'));
|
||||
$e.data('tags', true);
|
||||
}
|
||||
|
||||
if ($e.data('ajax-url')) {
|
||||
if ($e.data('ajaxUrl')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-ajax-url` attribute has been changed to ' +
|
||||
|
@ -4125,12 +4125,20 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('ajax--url', $e.data('ajax-url'));
|
||||
$e.data('ajax-Url', $e.data('ajaxUrl'));
|
||||
}
|
||||
|
||||
var dataset = {};
|
||||
|
||||
// Prefer the element's `dataset` attribute if it exists
|
||||
// jQuery 1.x does not correctly handle data attributes with multiple dashes
|
||||
var data = $.extend(true, {}, $e[0].dataset || $e.data());
|
||||
if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
|
||||
dataset = $.extend(true, {}, $e[0].dataset, $e.data());
|
||||
} else {
|
||||
dataset = $e.data();
|
||||
}
|
||||
|
||||
var data = $.extend(true, {}, dataset);
|
||||
|
||||
data = Utils._convertData(data);
|
||||
|
||||
|
|
18
dist/js/select2.full.js
vendored
18
dist/js/select2.full.js
vendored
|
@ -4542,7 +4542,7 @@ define('select2/options',[
|
|||
$e.prop('disabled', this.options.disabled);
|
||||
$e.prop('multiple', this.options.multiple);
|
||||
|
||||
if ($e.data('select2-tags')) {
|
||||
if ($e.data('select2Tags')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-select2-tags` attribute has been changed to ' +
|
||||
|
@ -4551,11 +4551,11 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('data', $e.data('select2-tags'));
|
||||
$e.data('data', $e.data('select2Tags'));
|
||||
$e.data('tags', true);
|
||||
}
|
||||
|
||||
if ($e.data('ajax-url')) {
|
||||
if ($e.data('ajaxUrl')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-ajax-url` attribute has been changed to ' +
|
||||
|
@ -4564,12 +4564,20 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('ajax--url', $e.data('ajax-url'));
|
||||
$e.data('ajax-Url', $e.data('ajaxUrl'));
|
||||
}
|
||||
|
||||
var dataset = {};
|
||||
|
||||
// Prefer the element's `dataset` attribute if it exists
|
||||
// jQuery 1.x does not correctly handle data attributes with multiple dashes
|
||||
var data = $.extend(true, {}, $e[0].dataset || $e.data());
|
||||
if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
|
||||
dataset = $.extend(true, {}, $e[0].dataset, $e.data());
|
||||
} else {
|
||||
dataset = $e.data();
|
||||
}
|
||||
|
||||
var data = $.extend(true, {}, dataset);
|
||||
|
||||
data = Utils._convertData(data);
|
||||
|
||||
|
|
4
dist/js/select2.full.min.js
vendored
4
dist/js/select2.full.min.js
vendored
File diff suppressed because one or more lines are too long
18
dist/js/select2.js
vendored
18
dist/js/select2.js
vendored
|
@ -4542,7 +4542,7 @@ define('select2/options',[
|
|||
$e.prop('disabled', this.options.disabled);
|
||||
$e.prop('multiple', this.options.multiple);
|
||||
|
||||
if ($e.data('select2-tags')) {
|
||||
if ($e.data('select2Tags')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-select2-tags` attribute has been changed to ' +
|
||||
|
@ -4551,11 +4551,11 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('data', $e.data('select2-tags'));
|
||||
$e.data('data', $e.data('select2Tags'));
|
||||
$e.data('tags', true);
|
||||
}
|
||||
|
||||
if ($e.data('ajax-url')) {
|
||||
if ($e.data('ajaxUrl')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-ajax-url` attribute has been changed to ' +
|
||||
|
@ -4564,12 +4564,20 @@ define('select2/options',[
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('ajax--url', $e.data('ajax-url'));
|
||||
$e.data('ajax-Url', $e.data('ajaxUrl'));
|
||||
}
|
||||
|
||||
var dataset = {};
|
||||
|
||||
// Prefer the element's `dataset` attribute if it exists
|
||||
// jQuery 1.x does not correctly handle data attributes with multiple dashes
|
||||
var data = $.extend(true, {}, $e[0].dataset || $e.data());
|
||||
if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
|
||||
dataset = $.extend(true, {}, $e[0].dataset, $e.data());
|
||||
} else {
|
||||
dataset = $e.data();
|
||||
}
|
||||
|
||||
var data = $.extend(true, {}, dataset);
|
||||
|
||||
data = Utils._convertData(data);
|
||||
|
||||
|
|
2
dist/js/select2.min.js
vendored
2
dist/js/select2.min.js
vendored
File diff suppressed because one or more lines are too long
18
src/js/select2/options.js
vendored
18
src/js/select2/options.js
vendored
|
@ -54,7 +54,7 @@ define([
|
|||
$e.prop('disabled', this.options.disabled);
|
||||
$e.prop('multiple', this.options.multiple);
|
||||
|
||||
if ($e.data('select2-tags')) {
|
||||
if ($e.data('select2Tags')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-select2-tags` attribute has been changed to ' +
|
||||
|
@ -63,11 +63,11 @@ define([
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('data', $e.data('select2-tags'));
|
||||
$e.data('data', $e.data('select2Tags'));
|
||||
$e.data('tags', true);
|
||||
}
|
||||
|
||||
if ($e.data('ajax-url')) {
|
||||
if ($e.data('ajaxUrl')) {
|
||||
if (window.console && console.warn) {
|
||||
console.warn(
|
||||
'Select2: The `data-ajax-url` attribute has been changed to ' +
|
||||
|
@ -76,12 +76,20 @@ define([
|
|||
);
|
||||
}
|
||||
|
||||
$e.data('ajax--url', $e.data('ajax-url'));
|
||||
$e.data('ajax-Url', $e.data('ajaxUrl'));
|
||||
}
|
||||
|
||||
var dataset = {};
|
||||
|
||||
// Prefer the element's `dataset` attribute if it exists
|
||||
// jQuery 1.x does not correctly handle data attributes with multiple dashes
|
||||
var data = $.extend(true, {}, $e[0].dataset || $e.data());
|
||||
if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
|
||||
dataset = $.extend(true, {}, $e[0].dataset, $e.data());
|
||||
} else {
|
||||
dataset = $e.data();
|
||||
}
|
||||
|
||||
var data = $.extend(true, {}, dataset);
|
||||
|
||||
data = Utils._convertData(data);
|
||||
|
||||
|
|
|
@ -216,3 +216,35 @@ test('converted into dataAdapter.query automatically', function (assert) {
|
|||
|
||||
assert.ok(called, 'The query function should have been called');
|
||||
});
|
||||
|
||||
module('Options - deprecated - data-ajax-url');
|
||||
|
||||
test('converted ajax-url to ajax--url automatically', function (assert) {
|
||||
var $test = $('<select data-ajax-url="test://url"></select>');
|
||||
var options = new Options({}, $test);
|
||||
|
||||
assert.ok(
|
||||
options.get('ajax'),
|
||||
'The `ajax` key was automatically created'
|
||||
);
|
||||
assert.equal(
|
||||
options.get('ajax').url,
|
||||
'test://url',
|
||||
'The `url` property for the `ajax` option was filled in correctly'
|
||||
);
|
||||
});
|
||||
|
||||
test('converted select2-tags to data/tags automatically', function (assert) {
|
||||
var $test = $('<select data-select2-tags="original data"></select>');
|
||||
var options = new Options({}, $test);
|
||||
|
||||
assert.ok(
|
||||
options.get('tags'),
|
||||
'The `tags` key is automatically set to true'
|
||||
);
|
||||
assert.equal(
|
||||
options.get('data'),
|
||||
'original data',
|
||||
'The `data` key is created with the original data'
|
||||
);
|
||||
});
|
||||
|
|
Loading…
Add table
Reference in a new issue