Fix #438 Too many ajax calls with multiple groups

Author: running-coder

dist/jquery.typeahead.min.js

@@ -4,7 +4,7 @@
  * Licensed under the MIT license
  *
  * @author Tom Bertrand
- * @version 2.10.5 (2018-7-20)
+ * @version 2.10.5 (2018-7-24)
  * @link http://www.runningcoder.org/jquerytypeahead/
  */
 (function (factory) {
@@ -813,6 +813,14 @@
                     this.query.length >= this.options.source[group].minLength &&
                     this.query.length <= this.options.source[group].maxLength
                 ) {
+                    if (
+                        this.filters.dropdown &&
+                        this.filters.dropdown.key === 'group' &&
+                        this.filters.dropdown.value !== group
+                    ) {
+                        continue;
+                    }
+
                     this.searchGroups.push(group);
                     if (!this.options.source[group].dynamic && this.source[group]) {
                         continue;
@@ -1119,7 +1127,7 @@
                                 _group = xhrObject.validForGroup[i];
                                 _request = scope.requests[_group];
 
-                                if (_request.callback.done instanceof Function) {
+                                if (typeof _request.callback.done === 'function') {
                                     _groupData[_group] = _request.callback.done.call(
                                         scope,
                                         data,
@@ -2858,7 +2866,7 @@
                     .html(item.template);
 
                 this.isDropdownEvent = true;
-                this.node.trigger("search" + this.namespace);
+                this.node.trigger("input" + this.namespace);
 
                 if (this.options.multiselect) {
                     this.adjustInputSize();

src/jquery.typeahead.js

@@ -21,7 +21,7 @@ describe('Typeahead $.ajax.callback.done Tests', () => {
             source: {
                 group1: {
                     ajax: {
-                        type: "POST",
+                        type: "GET",
                         url: "http://test.com/groups.json",
                         data: {
                             term: "{{query}}"
@@ -35,7 +35,7 @@ describe('Typeahead $.ajax.callback.done Tests', () => {
                 },
                 group2: {
                     ajax: {
-                        type: "POST",
+                        type: "GET",
                         url: "http://test.com/groups.json",
                         data: {
                             term: "{{query}}"

test/integration/ajax.callback.done.test.js

@@ -0,0 +1,104 @@
+const $ = require("jquery");
+const Typeahead = require('../../src/jquery.typeahead');
+
+describe('Typeahead $.ajax.callback.done Tests', () => {
+
+    let myTypeahead;
+    const group1DoneCallback = jest.fn();
+    const group2DoneCallback = jest.fn();
+    const group3DoneCallback = jest.fn();
+
+    beforeAll(() => {
+
+        document.body.innerHTML = `<form>
+            <div class="typeahead__container">
+                <div class="typeahead__field">
+                    <div class="typeahead__query">
+                        <input class="js-typeahead"
+                                name="q"
+                                type="search"
+                                autofocus
+                                autocomplete="off">
+                    </div>
+                    <div class="typeahead__button">
+                        <button type="submit">
+                            <span class="typeahead__search-icon"></span>
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </form>`;
+
+        myTypeahead = $.typeahead({
+            input: ".js-typeahead",
+            minLength: 0,
+            group: true,
+            maxItemPerGroup: 3,
+            dynamic: true,
+            dropdownFilter: "all",
+            source: {
+                group1: {
+                    ajax: {
+                        url: "http://test.com/game.json",
+                        path: "data",
+                        callback: {
+                            done: group1DoneCallback
+                        }
+                    }
+                },
+                group2: {
+                    ajax: {
+                        url: "http://test.com/category.json",
+                        path: "data",
+                        callback: {
+                            done: group2DoneCallback
+                        }
+                    }
+                },
+                group3: {
+                    ajax: {
+                        url: "http://test.com/tag.json",
+                        path: "data",
+                        callback: {
+                            done: group3DoneCallback
+                        }
+                    }
+                },
+            },
+        });
+    });
+
+    afterEach(() => {
+        jest.resetAllMocks();
+    });
+
+    it('Should trigger all group callbacks', (done) => {
+
+        myTypeahead.node.triggerHandler('input').done(function () {
+            expect(myTypeahead.searchGroups).toEqual(['group1', 'group2', 'group3'])
+            expect(group1DoneCallback).toHaveBeenCalled();
+            expect(group2DoneCallback).toHaveBeenCalled();
+            expect(group3DoneCallback).toHaveBeenCalled();
+            
+            done()
+        });
+
+    });
+
+    it('Should only trigger the selected group callback', (done) => {
+
+        let dropdownItems = myTypeahead.container.find('.' + myTypeahead.options.selector.dropdownItem);
+        dropdownItems.eq(0).find('a').trigger('click');
+
+        myTypeahead.node.triggerHandler('input').done(function () {
+            expect(myTypeahead.searchGroups).toEqual(['group1']);
+            expect(group1DoneCallback).toHaveBeenCalled();
+            expect(group2DoneCallback).not.toHaveBeenCalled();
+            expect(group3DoneCallback).not.toHaveBeenCalled();
+            
+            done()
+        });
+
+    });
+
+});

test/integration/dropdownFilter.test.js

@@ -43,7 +43,7 @@ fakeServer.respondWith('GET', /\/empty\.json/, [
     JSON.stringify([]),
 ]);
 
-fakeServer.respondWith('POST', /\/groups\.json/, [
+fakeServer.respondWith('GET', /\/groups\.json/, [
     200,
     { 'Content-Type': 'application/json' },
     JSON.stringify({