如何让 jQuery 插件像 Google 一样自动完成替换结果？

Question

我正在为两个表单字段使用 jQuery 插件 Autocomplete like Google -- foo 和 bar（取决于 foo）：

$(function() {
    $("#foo").autocomplete({
        minLength: 3,
        limit: 5,
        source : [{
            url:"/my/ajax/controller/foo?data[foo_number]=%QUERY%",
            type:'remote'
        }],  
    });
});

$(function() {
    $("#bar").autocomplete({
        minLength: 3,
        limit: 5,
        source : [
            function(query, add) {
                fooNumber = $('#foo-number').val();
                $.getJSON("/my/ajax/controller/bar?data[number]=" + query + "&data[foo_name]=" + fooNumber, function(response) {
                    add(response);
                })
        }],  
    });
});

它基本上可以工作，但是字段 bar 有问题。自动完成 AJAX 请求的每个进一步结果都会添加到最后一个，并且不会替换它。这导致 1. 重复的 antries 和 2. 过时的条目，例如当前 AJAX 请求未获得任何新结果，并显示为上次请求检索的列表。

我的代码有什么问题？ 如何每次只获取尚未检索到的结果？

Answer 1

我需要的选项调用 appendMethod:

$(function() {
    $("#bar").autocomplete({
        minLength: 3,
        limit: 5,
        appendMethod:'replace',
        source : [
            function(query, add) {
                fooNumber = $('#foo-number').val();
                $.getJSON("/my/ajax/controller/bar?data[number]=" + query + "&data[foo_name]=" + fooNumber, function(response) {
                    add(response);
                })
        }],  
    });
});

如何让 jQuery 插件像 Google 一样自动完成替换结果？

How to make the jQuery plugin Autocomplete like Google replace results?

javascript

ajax

jquery

autocomplete

jquery-autocomplete