Question

我正在尝试使用带有ajax调用的JQuery自动完成功能，它将返回字符串列表..当我尝试键入时，它显示所有字符串列表而不是基于输入过滤掉..不确定我哪里出错了.Below是我的自动完成功能..

$("#domainNameId").autocomplete({
        source : function(request, response) {
            console.log("in ajax ");
            $.ajax({
                url : "getAllDomains",
                type : "GET",
                contentType : "application/json",
                data : {
                    env : $("#environment").val()
                },
                dataType : "json",
                success : function(data) {
                     response(data); // list of strings..
                },
                error : function(x, t, m) {
                    console.trace();
                    if (!(console == 'undefined')) {
                        console.log("ERROR: " + x + t + m);
                    }
                    console.log(" At the end");
                }
            });

        },
    });

欣赏帮助..

Answer 1

您的后端似乎总是返回整个数据而不进行任何过滤（服务名称本身为getAllDomains）。在这种情况下，不需要使用source选项的函数形式来进行ajax调用。

您正在做的是在用户输入时向服务器发送多个AJAX请求。如果您的后端始终返回相同的数据，则向其发送多个请求是没有意义的。您可以简单地获取数据一次，然后使用响应作为源初始化自动完成，然后窗口小部件将按用户类型进行过滤。

文档说：

响应回调，它需要一个参数：向用户建议的数据。应根据提供的术语过滤此数据。

因此，如果您的服务器没有进行过滤，请不要使用函数表单来发出AJAX请求。

做类似的事情：

$(function() {
  // make a one-time request
  $.ajax({
    url: "getAllDomains",
    type: "GET",
    contentType: "application/json",
    dataType: "json",
    success: function(data) {
      // init the widget with response data and let it do the filtering
      $("#domainNameId").autocomplete({
        source: data
      });
    },
    error: function(x, t, m) {
      console.trace();
      if (!(console == 'undefined')) {
        console.log("ERROR: " + x + t + m);
      }
      console.log(" At the end");
    }
  });

});

Answer 2

在success回调中，您需要使用传递给data函数的request.term自行过滤source。

这里有关于jQuery自动填充source的更多信息：https://api.jqueryui.com/autocomplete/#option-source。

jquery自动完成 - 不过滤

2 个答案: