jQuery autofill - 添加到底层本地数据源数组

Question

在这个使用 jQuery 自动完成的基本示例中：

$("#textboxid").autocomplete(
    {
        source: testdata,
        delay: 100,
        minLength: 1
    });

其中testdata是数据的本地数组，建议以什么方式对基础源数组进行任何更改，并在自动完成选项中反映出来？

目前，如果我随后向testdata数组添加一个新项目（即在文本框元素上设置了自动完成之后），我在自动完成列表中看不到该新选项。如果我向页面动态添加新文本框并设置为自动完成，它确实会看到新选项。但现有元素没有。

Answer 1

最灵活的方法是使用回调作为源，它会轮询数组/对象/服务器以获取数据并返回适当的响应。

下面是如何对此进行测试的示例：

var testdata = ["foo","bar","baz","quux"];
$("#textboxid").autocomplete({
    source: function(request, callback) {
        var possiblematches = testdata.filter(function(v) {
            return v.match($.ui.autocomplete.escapeRegex(request.term));
        });
        callback(possiblematches);
    },
    delay: 100
});

演示：http://jsfiddle.net/Eeg5L/。有关source选项的文档和更多信息，请参阅此处。

或者，您可以在修改数组后使用以下方法重置源：

$("#textboxid").autocomplete("option","source", testdata);

我建议为您的数组使用一个 setter，它会在您修改数组时自动执行此操作。

Answer 2

当您更新testdata运行以下命令时：

$('#textboxid').autocomplete('option', 'source', testdata);