开发者

jquery autocomplete this.source is not a function error

I've implemented autocomplete on an input field, but the box does not show up and firebug returns "this.source is not a function". I've used autocomplete on other fields of the开发者_运维问答 same page without any problems. (two textarea's).

I'm using the following code to debug, same effect if I run from script file or Firebug command line.

var fakedata = ['test1','test2','test3','test4','ietsanders'];
$("#omschrijving").autocomplete(fakedata);

running jquery 1.4.2 and jquery ui 1.8.2, both minified versions.

Does anyone have an idea how autocomplete works fine on the textareas but causes this malfunctioning on inputs?

Error & Stack trace:

this.source is not a function
http://facturatie.autodealers.nl/dev/resources/js/jquery-ui-1.8.2.custom.min.js
Line 570
close(Object { name="a"})jquery....min.js (regel 570)
close(Object { name="a"}, Object { name="c"})jquery....min.js (regel 570)
response()


Answer is that the first parameter of the autocomplete should be an object containing the "source" property. This works

var fakedata = ['test1','test2','test3','test4','ietsanders'];
$("#omschrijving").autocomplete({source:fakedata});


If you were trying to use autocomplete from http://www.devbridge.com/projects/autocomplete/jquery/#demo, it now collides with the autocomplete method in jQuery UI. I had the same problem and later noticed that I could just use the jQuery UI implementation.

(NOTE: It appears that this page's documentation is wrong: http://docs.jquery.com/Plugins/Autocomplete#Setup)


If you use it with jQuery UI library it also has plugin named autocomplete. In this case you can use plugin alias devbridgeAutocomplete:

$('.autocomplete').devbridgeAutocomplete({ ... });

This solve the problem with jQuery UI collision


As Shelton stated, the version from devbridge.com (1.1.3) collides with jQuery UI (1.8.4). Got it working by making sure the devbridge version loads after jQuery UI's version.


Had similar problem for tagedit/autocomplete. It seems you also want to disable the autocomplete. Setting the source to false avoids these errors.

Solution:

options.autocompleteOptions.source = false;


Search at the end of jquery.autocomplete.js the following section:

Create chainable jQuery plugin:

$.fn.devbridgeAutocomplete = function (options, args) {....

This devbridgeAutocomplete is an alternative plugin to access to the same functionality using this lines:

if (!$.fn.autocomplete) {
    $.fn.autocomplete = $.fn.devbridgeAutocomplete;
}

So.. you can use devbridgeAutocomplete instead of autocomplete or any name by changing this $.fn.devbridgeAutocomplete


in my case I had a second import of jquery which I didn't realize. Something like:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.devbridge-autocomplete/1.2.27/jquery.autocomplete.min.js"></script> 

// More code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>

So be sure to import the autocomplete script after you initialized jquery.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜