Browse Source

Automatically open search when typing

This fixes an issue where the dropdown would not automatically
open when something was typed in the search box on a multiple
select.  This was most noticeable when the dropdown closed and
the search box was focused and the user started to type, as the
text would appear in the search box, queries would be sent out to
retrieve results, but the dropdown would not be opened to display
the results.

This also fixes an issue introduced in a recent commit where search
queries would be sent out twice on modern browsers that supported
both the `keyup` and `input` event.  The `keyup` event is now
properly debounced for these browsers and the queries are only
going out once.

This closes https://github.com/select2/select2/issues/3036.
Kevin Brown 10 years ago
parent
commit
94875679f8

+ 6 - 2
dist/js/select2.amd.full.js

@@ -1318,10 +1318,10 @@ define('select2/selection/search',[
     // both the `keyup` and `input` events.
     this.$selection.on('input', '.select2-search--inline', function (evt) {
       // Unbind the duplicated `keyup` event
-      $(this).off('keyup');
+      self.$selection.off('keyup.search');
     });
 
-    this.$selection.on('keyup input', '.select2-search--inline',
+    this.$selection.on('keyup.search input', '.select2-search--inline',
         function (evt) {
       self.handleSearch(evt);
     });
@@ -4471,6 +4471,10 @@ define('select2/core',[
     });
 
     this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open');
+      }
+
       this.data.query(params, function (data) {
         self.trigger('results:all', {
           data: data,

+ 6 - 2
dist/js/select2.amd.js

@@ -1318,10 +1318,10 @@ define('select2/selection/search',[
     // both the `keyup` and `input` events.
     this.$selection.on('input', '.select2-search--inline', function (evt) {
       // Unbind the duplicated `keyup` event
-      $(this).off('keyup');
+      self.$selection.off('keyup.search');
     });
 
-    this.$selection.on('keyup input', '.select2-search--inline',
+    this.$selection.on('keyup.search input', '.select2-search--inline',
         function (evt) {
       self.handleSearch(evt);
     });
@@ -4471,6 +4471,10 @@ define('select2/core',[
     });
 
     this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open');
+      }
+
       this.data.query(params, function (data) {
         self.trigger('results:all', {
           data: data,

+ 6 - 2
dist/js/select2.full.js

@@ -1757,10 +1757,10 @@ define('select2/selection/search',[
     // both the `keyup` and `input` events.
     this.$selection.on('input', '.select2-search--inline', function (evt) {
       // Unbind the duplicated `keyup` event
-      $(this).off('keyup');
+      self.$selection.off('keyup.search');
     });
 
-    this.$selection.on('keyup input', '.select2-search--inline',
+    this.$selection.on('keyup.search input', '.select2-search--inline',
         function (evt) {
       self.handleSearch(evt);
     });
@@ -4910,6 +4910,10 @@ define('select2/core',[
     });
 
     this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open');
+      }
+
       this.data.query(params, function (data) {
         self.trigger('results:all', {
           data: data,

File diff suppressed because it is too large
+ 0 - 0
dist/js/select2.full.min.js


+ 6 - 2
dist/js/select2.js

@@ -1757,10 +1757,10 @@ define('select2/selection/search',[
     // both the `keyup` and `input` events.
     this.$selection.on('input', '.select2-search--inline', function (evt) {
       // Unbind the duplicated `keyup` event
-      $(this).off('keyup');
+      self.$selection.off('keyup.search');
     });
 
-    this.$selection.on('keyup input', '.select2-search--inline',
+    this.$selection.on('keyup.search input', '.select2-search--inline',
         function (evt) {
       self.handleSearch(evt);
     });
@@ -4910,6 +4910,10 @@ define('select2/core',[
     });
 
     this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open');
+      }
+
       this.data.query(params, function (data) {
         self.trigger('results:all', {
           data: data,

File diff suppressed because it is too large
+ 0 - 0
dist/js/select2.min.js


+ 4 - 0
src/js/select2/core.js

@@ -272,6 +272,10 @@ define([
     });
 
     this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open');
+      }
+
       this.data.query(params, function (data) {
         self.trigger('results:all', {
           data: data,

+ 2 - 2
src/js/select2/selection/search.js

@@ -84,10 +84,10 @@ define([
     // both the `keyup` and `input` events.
     this.$selection.on('input', '.select2-search--inline', function (evt) {
       // Unbind the duplicated `keyup` event
-      $(this).off('keyup');
+      self.$selection.off('keyup.search');
     });
 
-    this.$selection.on('keyup input', '.select2-search--inline',
+    this.$selection.on('keyup.search input', '.select2-search--inline',
         function (evt) {
       self.handleSearch(evt);
     });

Some files were not shown because too many files changed in this diff