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 select2#2995.

Author: kevin-brown

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();

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();

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();

dist/js/select2.full.min.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();

dist/js/select2.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();