|
29 | 29 | escapeRegExChars: function (value) {
|
30 | 30 | return value.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
|
31 | 31 | },
|
32 |
| - createNode: function (html) { |
| 32 | + createNode: function (containerClass) { |
33 | 33 | var div = document.createElement('div');
|
34 |
| - div.innerHTML = html; |
35 |
| - return div.firstChild; |
| 34 | + div.className = containerClass; |
| 35 | + div.style.position = 'absolute'; |
| 36 | + div.style.display = 'none'; |
| 37 | + return div; |
36 | 38 | }
|
37 | 39 | };
|
38 | 40 | }()),
|
|
140 | 142 | }
|
141 | 143 | };
|
142 | 144 |
|
143 |
| - that.suggestionsContainer = Autocomplete.utils.createNode('<div class="' + options.containerClass + '" style="position: absolute; display: none;"></div>'); |
| 145 | + that.suggestionsContainer = Autocomplete.utils.createNode(options.containerClass); |
144 | 146 |
|
145 | 147 | container = $(that.suggestionsContainer);
|
146 | 148 |
|
|
175 | 177 | }
|
176 | 178 | };
|
177 | 179 |
|
178 |
| - $(window).on('resize', that.fixPositionCapture); |
| 180 | + $(window).on('resize.autocomplete', that.fixPositionCapture); |
179 | 181 |
|
180 | 182 | that.el.on('keydown.autocomplete', function (e) { that.onKeyPress(e); });
|
181 | 183 | that.el.on('keyup.autocomplete', function (e) { that.onKeyUp(e); });
|
182 | 184 | that.el.on('blur.autocomplete', function () { that.onBlur(); });
|
183 |
| - that.el.on('focus.autocomplete', function () { that.fixPosition(); }); |
| 185 | + that.el.on('focus.autocomplete', function () { that.onFocus(); }); |
184 | 186 | that.el.on('change.autocomplete', function (e) { that.onKeyUp(e); });
|
185 | 187 | },
|
186 | 188 |
|
| 189 | + onFocus: function () { |
| 190 | + var that = this; |
| 191 | + that.fixPosition(); |
| 192 | + if (that.options.minChars <= that.el.val().length) { |
| 193 | + that.onValueChange(); |
| 194 | + } |
| 195 | + }, |
| 196 | + |
187 | 197 | onBlur: function () {
|
188 | 198 | this.enableKillerFn();
|
189 | 199 | },
|
|
220 | 230 | },
|
221 | 231 |
|
222 | 232 | disable: function () {
|
223 |
| - this.disabled = true; |
| 233 | + var that = this; |
| 234 | + that.disabled = true; |
| 235 | + if (that.currentRequest) { |
| 236 | + that.currentRequest.abort(); |
| 237 | + } |
224 | 238 | },
|
225 | 239 |
|
226 | 240 | enable: function () {
|
|
229 | 243 |
|
230 | 244 | fixPosition: function () {
|
231 | 245 | var that = this,
|
232 |
| - offset; |
| 246 | + offset, |
| 247 | + styles; |
233 | 248 |
|
234 | 249 | // Don't adjsut position if custom container has been specified:
|
235 | 250 | if (that.options.appendTo !== 'body') {
|
|
238 | 253 |
|
239 | 254 | offset = that.el.offset();
|
240 | 255 |
|
241 |
| - $(that.suggestionsContainer).css({ |
| 256 | + styles = { |
242 | 257 | top: (offset.top + that.el.outerHeight()) + 'px',
|
243 | 258 | left: offset.left + 'px'
|
244 |
| - }); |
| 259 | + }; |
| 260 | + |
| 261 | + if (that.options.width === 'auto') { |
| 262 | + styles.width = (that.el.outerWidth() - 2) + 'px'; |
| 263 | + } |
| 264 | + |
| 265 | + $(that.suggestionsContainer).css(styles); |
245 | 266 | },
|
246 | 267 |
|
247 | 268 | enableKillerFn: function () {
|
|
260 | 281 | that.intervalId = window.setInterval(function () {
|
261 | 282 | that.hide();
|
262 | 283 | that.stopKillSuggestions();
|
263 |
| - }, 300); |
| 284 | + }, 50); |
264 | 285 | },
|
265 | 286 |
|
266 | 287 | stopKillSuggestions: function () {
|
|
431 | 452 | if ($.isFunction(options.serviceUrl)) {
|
432 | 453 | serviceUrl = options.serviceUrl.call(that.element, q);
|
433 | 454 | }
|
434 |
| - if(this.currentRequest != null) { |
435 |
| - this.currentRequest.abort(); |
| 455 | + if (that.currentRequest) { |
| 456 | + that.currentRequest.abort(); |
436 | 457 | }
|
437 |
| - this.currentRequest = $.ajax({ |
| 458 | + that.currentRequest = $.ajax({ |
438 | 459 | url: serviceUrl,
|
439 | 460 | data: options.ignoreParams ? null : options.params,
|
440 | 461 | type: options.type,
|
441 | 462 | dataType: options.dataType
|
442 | 463 | }).done(function (data) {
|
| 464 | + that.currentRequest = null; |
443 | 465 | that.processResponse(data, q);
|
444 | 466 | options.onSearchComplete.call(that.element, q);
|
445 | 467 | }).fail(function (jqXHR, textStatus, errorThrown) {
|
|
481 | 503 | className = that.classes.suggestion,
|
482 | 504 | classSelected = that.classes.selected,
|
483 | 505 | container = $(that.suggestionsContainer),
|
| 506 | + beforeRender = that.options.beforeRender, |
484 | 507 | html = '',
|
485 | 508 | width;
|
486 | 509 |
|
|
498 | 521 | container.width(width > 0 ? width : 300);
|
499 | 522 | }
|
500 | 523 |
|
501 |
| - container.html(html).show(); |
502 |
| - that.visible = true; |
| 524 | + container.html(html); |
503 | 525 |
|
504 | 526 | // Select first value by default:
|
505 | 527 | if (that.options.autoSelectFirst) {
|
506 | 528 | that.selectedIndex = 0;
|
507 | 529 | container.children().first().addClass(classSelected);
|
508 | 530 | }
|
509 | 531 |
|
| 532 | + if ($.isFunction(beforeRender)) { |
| 533 | + beforeRender.call(that.element, container); |
| 534 | + } |
| 535 | + |
| 536 | + container.show(); |
| 537 | + that.visible = true; |
| 538 | + |
510 | 539 | that.findBestHint();
|
511 | 540 | },
|
512 | 541 |
|
|
703 | 732 | var that = this;
|
704 | 733 | that.el.off('.autocomplete').removeData('autocomplete');
|
705 | 734 | that.disableKillerFn();
|
706 |
| - $(window).off('resize', that.fixPositionCapture); |
| 735 | + $(window).off('resize.autocomplete', that.fixPositionCapture); |
707 | 736 | $(that.suggestionsContainer).remove();
|
708 | 737 | }
|
709 | 738 | };
|
|
0 commit comments