Quellcode durchsuchen

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.
Kevin Brown vor 10 Jahren
Ursprung
Commit
0c0e2527fa

+ 5 - 0
dist/js/select2.amd.full.js

@@ -1256,6 +1256,7 @@ define('select2/selection/search',[
       self.$search.attr('tabindex', -1);
 
       self.$search.val('');
+      self.$search.focus();
     });
 
     container.on('enable', function () {
@@ -1269,6 +1270,10 @@ define('select2/selection/search',[
     this.$selection.on('keydown', '.select2-search--inline', function (evt) {
       evt.stopPropagation();
 
+      if (!container.isOpen()) {
+        self.trigger('open');
+      }
+
       self.trigger('keypress', evt);
 
       self._keyUpPrevented = evt.isDefaultPrevented();

+ 5 - 0
dist/js/select2.amd.js

@@ -1256,6 +1256,7 @@ define('select2/selection/search',[
       self.$search.attr('tabindex', -1);
 
       self.$search.val('');
+      self.$search.focus();
     });
 
     container.on('enable', function () {
@@ -1269,6 +1270,10 @@ define('select2/selection/search',[
     this.$selection.on('keydown', '.select2-search--inline', function (evt) {
       evt.stopPropagation();
 
+      if (!container.isOpen()) {
+        self.trigger('open');
+      }
+
       self.trigger('keypress', evt);
 
       self._keyUpPrevented = evt.isDefaultPrevented();

+ 5 - 0
dist/js/select2.full.js

@@ -1694,6 +1694,7 @@ define('select2/selection/search',[
       self.$search.attr('tabindex', -1);
 
       self.$search.val('');
+      self.$search.focus();
     });
 
     container.on('enable', function () {
@@ -1707,6 +1708,10 @@ define('select2/selection/search',[
     this.$selection.on('keydown', '.select2-search--inline', function (evt) {
       evt.stopPropagation();
 
+      if (!container.isOpen()) {
+        self.trigger('open');
+      }
+
       self.trigger('keypress', evt);
 
       self._keyUpPrevented = evt.isDefaultPrevented();

Datei-Diff unterdrückt, da er zu groß ist
+ 0 - 0
dist/js/select2.full.min.js


+ 5 - 0
dist/js/select2.js

@@ -1694,6 +1694,7 @@ define('select2/selection/search',[
       self.$search.attr('tabindex', -1);
 
       self.$search.val('');
+      self.$search.focus();
     });
 
     container.on('enable', function () {
@@ -1707,6 +1708,10 @@ define('select2/selection/search',[
     this.$selection.on('keydown', '.select2-search--inline', function (evt) {
       evt.stopPropagation();
 
+      if (!container.isOpen()) {
+        self.trigger('open');
+      }
+
       self.trigger('keypress', evt);
 
       self._keyUpPrevented = evt.isDefaultPrevented();

Datei-Diff unterdrückt, da er zu groß ist
+ 0 - 0
dist/js/select2.min.js


+ 5 - 0
src/js/select2/selection/search.js

@@ -39,6 +39,7 @@ define([
       self.$search.attr('tabindex', -1);
 
       self.$search.val('');
+      self.$search.focus();
     });
 
     container.on('enable', function () {
@@ -52,6 +53,10 @@ define([
     this.$selection.on('keydown', '.select2-search--inline', function (evt) {
       evt.stopPropagation();
 
+      if (!container.isOpen()) {
+        self.trigger('open');
+      }
+
       self.trigger('keypress', evt);
 
       self._keyUpPrevented = evt.isDefaultPrevented();

Einige Dateien werden nicht angezeigt, da zu viele Dateien in diesem Diff geändert wurden.