Autocomplete plugin: Call external web service to query data

[coreycoto]

Code:

                $("#txtTagInput").autocomplete('http://server/ 
webservice', { 
                    contentType: "application/json", 
                    cacheLength: 1, 
                    max: 10, 
                    multiple: true, 
                    dataType: 'json' 
                }); 


        function request(term, success, failure) { 
                if (!options.matchCase) 
                        term = term.toLowerCase(); 
                var data = cache.load(term); 
                // recieve the cached data 
                if (data && data.length) { 
                        success(term, data); 
                // if an AJAX url has been supplied, try loading the data now 
                } else if( (typeof options.url == "string") && (options.url.length > 
0) ){ 


                        var extraParams = { 
                                timestamp: +new Date() 
                        }; 
                        $.each(options.extraParams, function(key, param) { 
                                extraParams[key] = typeof param == "function" ? param() : param; 
                        }); 


                        $.ajax({ 
                                // try to leverage ajaxQueue plugin to abort previous requests 
                                mode: "abort", 
                                // limit abortion to this input 
                                port: "autocomplete" + input.name, 
                                dataType: options.dataType, 
                                url: options.url, 
                                data: $.extend({ 
                                        q: lastWord(term), 
                                        limit: options.max 
                                }, extraParams), 
                                success: function(data) { 
                                    if (options.dataType == "json") { 
                                            cache.flush(); 
                                            cache.populateUrlData(data); 
                                            var results = cache.load(term); 
                                            success(term, results); 
                                    } 
                                    else { 
                                                var parsed = options.parse && options.parse(data) || 
parse(data); 
                                                cache.add(term, parsed); 
                                                success(term, parsed); 
                    } 
                                } 
                        }); 
                } else { 
                        // if we have a failure, we need to empty the list -- this prevents 
the the [TAB] key from selecting the last successful match 
                        select.emptyList(); 
                        failure(term); 
                } 
        }; 


jquery.autocomplete.js Code: 
        function populate(urlData){ 
                if (urlData) { 
                        options.data = urlData; 
                } 


                [original populate() function] 


        return { 
                flush: flush, 
                add: add, 
                populate: populate, 
                populateUrlData: function(urlData) { populate(urlData); }, 
                load: function(q) { 

[davidserduke]

See the duplicate #2756 in case that has needed info.

[joern]

The autocomplete plugin is now developed under the jQuery UI umbrella. Reopen a ticket there ( http://dev.jqueryui.com/) or participate on the planning wiki ( http://wiki.jqueryui.com/Autocomplete) if appropiate.