Skip to content

Commit 525f661

Browse files
authored
Reposition dropdown whenever items are selected (select2#5590)
* Reposition dropdown whenever items are selected This fixes an old bug where if you had a multiple select with the `closeOnSelect` option set to `false` and many options being selected, the dropdown would not reposition itself if the selected options expanded the container down another line. This was because the dropdown was only being repositioned when it was opened, closed, or if something around it was scrolled or resized. Unfortunately, in most cases none of these happened and the dropdown would start covering the selections. This was fixed by telling Select2 to resize the dropdown when new options are selected or existing options are unselected. Fixes select2#4377 * Attach positioning handlers at bind time The positioning handlers have been attached at the time that the dropdown is opened since when they were first committed many years ago. It's not actually clear why this was being done, since they don't rely on anything involving the dropdown being open. This removes the flag and process for setting these handlers only after the dropdown was opened for the first time, and moves these handlers to always be set at bind time.
1 parent efbfd14 commit 525f661

1 file changed

Lines changed: 20 additions & 16 deletions

File tree

src/js/select2/dropdown/attachBody.js

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -11,34 +11,38 @@ define([
1111
AttachBody.prototype.bind = function (decorated, container, $container) {
1212
var self = this;
1313

14-
var setupResultsEvents = false;
15-
1614
decorated.call(this, container, $container);
1715

1816
container.on('open', function () {
1917
self._showDropdown();
2018
self._attachPositioningHandler(container);
21-
22-
if (!setupResultsEvents) {
23-
setupResultsEvents = true;
24-
25-
container.on('results:all', function () {
26-
self._positionDropdown();
27-
self._resizeDropdown();
28-
});
29-
30-
container.on('results:append', function () {
31-
self._positionDropdown();
32-
self._resizeDropdown();
33-
});
34-
}
3519
});
3620

3721
container.on('close', function () {
3822
self._hideDropdown();
3923
self._detachPositioningHandler(container);
4024
});
4125

26+
container.on('results:all', function () {
27+
self._positionDropdown();
28+
self._resizeDropdown();
29+
});
30+
31+
container.on('results:append', function () {
32+
self._positionDropdown();
33+
self._resizeDropdown();
34+
});
35+
36+
container.on('select', function () {
37+
self._positionDropdown();
38+
self._resizeDropdown();
39+
});
40+
41+
container.on('unselect', function () {
42+
self._positionDropdown();
43+
self._resizeDropdown();
44+
});
45+
4246
this.$dropdownContainer.on('mousedown', function (evt) {
4347
evt.stopPropagation();
4448
});

0 commit comments

Comments
 (0)