Question

可能重复：
jquery autocomplete this.source is not a function error

我有一个自动填充功能，我想连接到我的API以返回所有客户帐号。问题是我的API返回一个对象：AccountNumber，InvoiceNumber，Name，Address等。当我尝试仅将我的源设为AccountNumber时，如下所示：

$.getJSON('/api/Customers', function(data) {
    $("#AccountNumber").autocomplete({
        source: data.AccountNumber,
        minLength: 4
    });
});

我收回了这个错误：

Uncaught TypeError: Property 'source' of object #<Object> is not a function

我在这里做错了什么想法？

Answer 1

由于回调函数返回一个Object，因此您必须提取数据并将其放在一个文件中。只要data是一个帐户对象数组，您就可以尝试：

$.getJSON('/api/Customers', function(data) {
    var acctNums = [];
    for(a in data) {
        acctNums.push(data[a].AccountNumber);
    }   

    $("#AccountNumber").autocomplete({
        source: acctNums,
        minLength: 4
    });
});

另一个选择是添加一个不同的Request路由，该路由只返回一组客户帐号。这样你就可以这样传递它：

$.getJSON('/api/Customers/AccountNums', function(data) {
    $("#AccountNumber").autocomplete({
        source: data,
        minLength: 4
    });
});

最后，你可以让jQuery UI plugin handle the calls。您需要创建一个不同的请求路由，该路由仅为自动完成返回一组JSON对象（每个都包含value和label属性）。然后只需使用路径的绝对或相对URL即可获取数据。以下是一个小例子：

$("#AccountNumber").autocomplete({
    // This GET Request returns an Array of Objects used for Auto-Complete:
    // [ { label: "Choice1", value: "value1" }, ... ]
    source: '/api/Customers/AccountNumsAuto',
    minLength: 4
});

Answer 2

jQuery UI自动完成的source属性必须是：

一系列结果：
source : ["string1","string2","string3","string4"]
一个字符串（处理查询的远程PHP页面的url），这将触发对此页面的ajax请求，其参数名为term，其中包含搜索值：
source : "page.php"
使用2个参数request和response调用的函数。第一个包含搜索的值（request.term），第二个包含您必须用值填充的对象。

您应该阅读jQuery UI documentation。
在您的情况下，您可以将您的JSon转换为结果数组。

远程设置自动完成源

2 个答案: