Skip to content

Commit fe1374f

Browse files
committed
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. select2#2903
1 parent 751fc63 commit fe1374f

13 files changed

Lines changed: 94 additions & 45 deletions

File tree

dist/css/select2.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -142,6 +142,8 @@
142142
.select2-container--default.select2-container--disabled .select2-selection--single {
143143
background-color: #eee;
144144
cursor: default; }
145+
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
146+
display: none; }
145147
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
146148
border-color: transparent transparent #888 transparent;
147149
border-width: 0 4px 5px 4px; }
@@ -186,6 +188,8 @@
186188
.select2-container--default.select2-container--disabled .select2-selection--multiple {
187189
background-color: #eee;
188190
cursor: default; }
191+
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
192+
display: none; }
189193
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
190194
border-top-left-radius: 0;
191195
border-top-right-radius: 0; }

dist/css/select2.min.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/js/select2.amd.full.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1062,11 +1062,16 @@ define('select2/selection/allowClear',[
10621062

10631063
this.$selection.on('mousedown', '.select2-selection__clear',
10641064
function (evt) {
1065-
evt.stopPropagation();
1065+
// Ignore the event if it is disabled
1066+
if (self.options.get('disabled')) {
1067+
return;
1068+
}
10661069

1067-
self.$element.val(self.placeholder.id).trigger('change');
1070+
evt.stopPropagation();
10681071

1069-
self.trigger('toggle');
1072+
self.$element.val(self.placeholder.id).trigger('change');
1073+
1074+
self.trigger('toggle');
10701075
});
10711076
};
10721077

@@ -2873,6 +2878,8 @@ define('select2/dropdown',[
28732878
};
28742879

28752880
Dropdown.prototype.bind = function (container, $container) {
2881+
var self = this;
2882+
28762883
container.on('select', function (params) {
28772884
self._onSelect(params);
28782885
});
@@ -2883,11 +2890,11 @@ define('select2/dropdown',[
28832890
};
28842891

28852892
Dropdown.prototype._onSelect = function () {
2886-
self.trigger('close');
2893+
this.trigger('close');
28872894
};
28882895

28892896
Dropdown.prototype._onUnSelect = function () {
2890-
self.trigger('close');
2897+
this.trigger('close');
28912898
};
28922899

28932900
return Dropdown;
@@ -4055,9 +4062,9 @@ define('select2/core',[
40554062
Select2.prototype.enable = function (args) {
40564063
if (console && console.warn) {
40574064
console.warn(
4058-
'Select2: The `select2("val")` method has been deprecated and will be' +
4059-
' removed in later Select2 versions. Use $element.prop("disabled") ' +
4060-
'instead.'
4065+
'Select2: The `select2("enable")` method has been deprecated and will' +
4066+
' be removed in later Select2 versions. Use $element.prop("disabled")' +
4067+
' instead.'
40614068
);
40624069
}
40634070

dist/js/select2.amd.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1062,11 +1062,16 @@ define('select2/selection/allowClear',[
10621062

10631063
this.$selection.on('mousedown', '.select2-selection__clear',
10641064
function (evt) {
1065-
evt.stopPropagation();
1065+
// Ignore the event if it is disabled
1066+
if (self.options.get('disabled')) {
1067+
return;
1068+
}
10661069

1067-
self.$element.val(self.placeholder.id).trigger('change');
1070+
evt.stopPropagation();
10681071

1069-
self.trigger('toggle');
1072+
self.$element.val(self.placeholder.id).trigger('change');
1073+
1074+
self.trigger('toggle');
10701075
});
10711076
};
10721077

@@ -2873,6 +2878,8 @@ define('select2/dropdown',[
28732878
};
28742879

28752880
Dropdown.prototype.bind = function (container, $container) {
2881+
var self = this;
2882+
28762883
container.on('select', function (params) {
28772884
self._onSelect(params);
28782885
});
@@ -2883,11 +2890,11 @@ define('select2/dropdown',[
28832890
};
28842891

28852892
Dropdown.prototype._onSelect = function () {
2886-
self.trigger('close');
2893+
this.trigger('close');
28872894
};
28882895

28892896
Dropdown.prototype._onUnSelect = function () {
2890-
self.trigger('close');
2897+
this.trigger('close');
28912898
};
28922899

28932900
return Dropdown;
@@ -4055,9 +4062,9 @@ define('select2/core',[
40554062
Select2.prototype.enable = function (args) {
40564063
if (console && console.warn) {
40574064
console.warn(
4058-
'Select2: The `select2("val")` method has been deprecated and will be' +
4059-
' removed in later Select2 versions. Use $element.prop("disabled") ' +
4060-
'instead.'
4065+
'Select2: The `select2("enable")` method has been deprecated and will' +
4066+
' be removed in later Select2 versions. Use $element.prop("disabled")' +
4067+
' instead.'
40614068
);
40624069
}
40634070

dist/js/select2.full.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -10597,11 +10597,16 @@ define('select2/selection/allowClear',[
1059710597

1059810598
this.$selection.on('mousedown', '.select2-selection__clear',
1059910599
function (evt) {
10600-
evt.stopPropagation();
10600+
// Ignore the event if it is disabled
10601+
if (self.options.get('disabled')) {
10602+
return;
10603+
}
1060110604

10602-
self.$element.val(self.placeholder.id).trigger('change');
10605+
evt.stopPropagation();
1060310606

10604-
self.trigger('toggle');
10607+
self.$element.val(self.placeholder.id).trigger('change');
10608+
10609+
self.trigger('toggle');
1060510610
});
1060610611
};
1060710612

@@ -12408,6 +12413,8 @@ define('select2/dropdown',[
1240812413
};
1240912414

1241012415
Dropdown.prototype.bind = function (container, $container) {
12416+
var self = this;
12417+
1241112418
container.on('select', function (params) {
1241212419
self._onSelect(params);
1241312420
});
@@ -12418,11 +12425,11 @@ define('select2/dropdown',[
1241812425
};
1241912426

1242012427
Dropdown.prototype._onSelect = function () {
12421-
self.trigger('close');
12428+
this.trigger('close');
1242212429
};
1242312430

1242412431
Dropdown.prototype._onUnSelect = function () {
12425-
self.trigger('close');
12432+
this.trigger('close');
1242612433
};
1242712434

1242812435
return Dropdown;
@@ -13590,9 +13597,9 @@ define('select2/core',[
1359013597
Select2.prototype.enable = function (args) {
1359113598
if (console && console.warn) {
1359213599
console.warn(
13593-
'Select2: The `select2("val")` method has been deprecated and will be' +
13594-
' removed in later Select2 versions. Use $element.prop("disabled") ' +
13595-
'instead.'
13600+
'Select2: The `select2("enable")` method has been deprecated and will' +
13601+
' be removed in later Select2 versions. Use $element.prop("disabled")' +
13602+
' instead.'
1359613603
);
1359713604
}
1359813605

dist/js/select2.full.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/js/select2.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1490,11 +1490,16 @@ define('select2/selection/allowClear',[
14901490

14911491
this.$selection.on('mousedown', '.select2-selection__clear',
14921492
function (evt) {
1493-
evt.stopPropagation();
1493+
// Ignore the event if it is disabled
1494+
if (self.options.get('disabled')) {
1495+
return;
1496+
}
14941497

1495-
self.$element.val(self.placeholder.id).trigger('change');
1498+
evt.stopPropagation();
14961499

1497-
self.trigger('toggle');
1500+
self.$element.val(self.placeholder.id).trigger('change');
1501+
1502+
self.trigger('toggle');
14981503
});
14991504
};
15001505

@@ -3301,6 +3306,8 @@ define('select2/dropdown',[
33013306
};
33023307

33033308
Dropdown.prototype.bind = function (container, $container) {
3309+
var self = this;
3310+
33043311
container.on('select', function (params) {
33053312
self._onSelect(params);
33063313
});
@@ -3311,11 +3318,11 @@ define('select2/dropdown',[
33113318
};
33123319

33133320
Dropdown.prototype._onSelect = function () {
3314-
self.trigger('close');
3321+
this.trigger('close');
33153322
};
33163323

33173324
Dropdown.prototype._onUnSelect = function () {
3318-
self.trigger('close');
3325+
this.trigger('close');
33193326
};
33203327

33213328
return Dropdown;
@@ -4483,9 +4490,9 @@ define('select2/core',[
44834490
Select2.prototype.enable = function (args) {
44844491
if (console && console.warn) {
44854492
console.warn(
4486-
'Select2: The `select2("val")` method has been deprecated and will be' +
4487-
' removed in later Select2 versions. Use $element.prop("disabled") ' +
4488-
'instead.'
4493+
'Select2: The `select2("enable")` method has been deprecated and will' +
4494+
' be removed in later Select2 versions. Use $element.prop("disabled")' +
4495+
' instead.'
44894496
);
44904497
}
44914498

dist/js/select2.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/js/select2/core.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -308,9 +308,9 @@ define([
308308
Select2.prototype.enable = function (args) {
309309
if (console && console.warn) {
310310
console.warn(
311-
'Select2: The `select2("val")` method has been deprecated and will be' +
312-
' removed in later Select2 versions. Use $element.prop("disabled") ' +
313-
'instead.'
311+
'Select2: The `select2("enable")` method has been deprecated and will' +
312+
' be removed in later Select2 versions. Use $element.prop("disabled")' +
313+
' instead.'
314314
);
315315
}
316316

src/js/select2/dropdown.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ define([
3434
};
3535

3636
Dropdown.prototype.bind = function (container, $container) {
37+
var self = this;
38+
3739
container.on('select', function (params) {
3840
self._onSelect(params);
3941
});
@@ -44,11 +46,11 @@ define([
4446
};
4547

4648
Dropdown.prototype._onSelect = function () {
47-
self.trigger('close');
49+
this.trigger('close');
4850
};
4951

5052
Dropdown.prototype._onUnSelect = function () {
51-
self.trigger('close');
53+
this.trigger('close');
5254
};
5355

5456
return Dropdown;

0 commit comments

Comments
 (0)