Commits

Mark Lavin committed aa77ee4

Pagination updates and tests to work with keyboard events as well as mouse click.

Comments (0)

Files changed (2)

selectable/static/selectable/js/jquery.dj.selectable.js

             if (this.selectableType === 'combobox') {
                 // Change auto-complete options
                 this.option("delay", 0);
-                this.option("minLength", 0);
+                //this.option("minLength", 0);
                 $input.removeClass("ui-corner-all")
                 .addClass("ui-corner-left ui-combo-input");
                 // Add show all items button
                         self.close();
                     }
                     // pass empty string as value to search for, displaying all results
-                    self.search("");
+                    self._search("");
                     $input.focus();
                 });
             }
 
         // Override the default source creation
         _initSource: function () {
-            var self = this;
+            var self = this,
+                $input = $(this.element);
             this.source = function dataSource(request, response) {
                 /* Custom data source to uses the lookup url with pagination
                 Adds hook for adjusting query parameters.
                 Includes timestamp to prevent browser caching the lookup. */
-                var now = new Date().getTime();
-                var query = {term: request.term, timestamp: now};
+                var now = new Date().getTime(),
+                    query = {term: request.term, timestamp: now},
+                    page = $input.data("page");
                 if (self.options.prepareQuery) {
                     self.options.prepareQuery.apply(self, [query]);
                 }
-                var page = $(self.element).data("page");
                 if (page) {
                     query.page = page;
                 }
                 function unwrapResponse(data) {
-                    var results = data.data;
-                    var meta = data.meta;
+                    var results = data.data,
+                        meta = data.meta;
                     if (meta.next_page && meta.more) {
                         results.push({
                             id: '',
                             value: '',
                             label: meta.more,
-                            page: meta.next_page
+                            page: meta.next_page,
+                            term: request.term
                         });
                     }
                     return response(results);
                 .append($("<a></a>").append(label))
                 .appendTo(ul);
             if (item.page) {
-                li.addClass('selectable-paginator').click(function (e) {
-                    $input.data("page", item.page);
-                    self.search();
-                    return false;
-                });
+                li.addClass('selectable-paginator');
             }
             return li;
         },
             ul.position($.extend({of: this.element}, this.options.position));
             if (this.options.autoFocus) {
                 this.menu.next(new $.Event("mouseover"));
+            } else if (page) {
+                $input.focus();
             }
         },
         // Override default trigger for additional change/select logic
         _trigger: function (type, event, data) {
-            var $input = $(this.element);
+            var $input = $(this.element),
+                self = this;
             if (type === "select") {
                 $input.removeClass('ui-state-error');
+                if (data.item.page) {
+                    $input.data("page", data.item.page);
+                    this._search(data.item.term);
+                    return false;
+                }
                 return this.select(data.item, event);
             } else if (type === "change") {
                 $input.removeClass('ui-state-error');
             // Call super trigger
             // This could be replaced by this._super() with jQuery UI 1.9
             return $.ui.autocomplete.prototype._trigger.apply(this, arguments);
+        },
+        close: function (event) {
+            var page = $(this.element).data('page');
+            if (page != null) {
+                return;
+            }
+            // Call super trigger
+            // This could be replaced by this._super() with jQuery UI 1.9
+            return $.ui.autocomplete.prototype.close.apply(this, arguments);
         }
 	});
 

selectable/tests/qunit/test-events.js

             self.requests[0].respond(200, {"Content-Type": "application/json"},
                 JSON.stringify(response)
             );
-            $('.selectable-paginator:visible').click();
+            $('.ui-menu-item.selectable-paginator:visible a').trigger("mouseenter");
+            $('.ui-menu-item.selectable-paginator:visible a').trigger("click");
+            equal(self.requests.length, 2, "Another AJAX request should be triggered.");
+            equal(count, 0, "djselectableselect should not fire for new page.");
+            start();
+        }, 300);
+    });
+
+    test("Pagination Enter", function() {
+        expect(3);
+        var count = 0,
+            down = jQuery.Event("keydown"),
+            enter = jQuery.Event("keydown"),
+            response = paginatedLookupResponse(),
+            self = this;
+        down.keyCode = $.ui.keyCode.DOWN;
+        enter.keyCode = $.ui.keyCode.ENTER;
+        this.textInput.bind('djselectableselect', function(e, item) {
+            count = count + 1;
+        });
+        this.textInput.val("ap").keydown();
+        stop();
+        setTimeout(function () {
+            equal(self.requests.length, 1, "AJAX request should be triggered.");
+            self.requests[0].respond(200, {"Content-Type": "application/json"},
+                JSON.stringify(response)
+            );
+            self.textInput.trigger(down);
+            self.textInput.trigger(down);
+            self.textInput.trigger(down);
+            self.textInput.trigger(enter);
             equal(self.requests.length, 2, "Another AJAX request should be triggered.");
             equal(count, 0, "djselectableselect should not fire for new page.");
             start();
     test("Pagination Render", function() {
         expect(2);
         var count = 0,
+            down = jQuery.Event("keydown"),
+            enter = jQuery.Event("keydown"),
             response = paginatedLookupResponse(),
             self = this;
+        down.keyCode = $.ui.keyCode.DOWN;
+        enter.keyCode = $.ui.keyCode.ENTER;
         this.textInput.val("ap").keydown();
         stop();
         setTimeout(function () {
             );
             options = $('li.ui-menu-item:visible');
             equal(options.length, 3, "Currently 3 menu items.");
-            $('.selectable-paginator:visible').click();
+            // $('.selectable-paginator:visible').click();
+            self.textInput.trigger(down);
+            self.textInput.trigger(down);
+            self.textInput.trigger(down);
+            self.textInput.trigger(enter);
             self.requests[1].respond(200, {"Content-Type": "application/json"},
                 JSON.stringify(response)
             );