Jquery自动完成不起作用答案

【问题标题】：Jquery Autocomplete doesn't workJquery自动完成不起作用
【发布时间】：2014-04-28 17:41:53
【问题描述】：

我正在尝试使用来自数据库的自动完成源将自动完成添加到输入框（我在 asp.net/vb.net 项目中）。所以我创建了一个 web 服务并进行了 ajax 调用：

<script type="text/javascript">
            $(document).ready(function () {

                $('#modelloInput').autocomplete({

                    source: function (request, response) {
                        $.ajax({
                            type: "POST",
                            contentType: "application/json; charset=utf-8",
                            url: "WebServices/AutocompleteWS.asmx/getTuttiIModelli",
                            data: "{'prefix':'" + request.term + "'}",
                            dataType: "json",
                            async: true,
                            success: function (data) {
                                response(data.d);
                            },
                            error: function (result) {
                                //alert("Error");
                            }
                        });
                    }

                });
            }); 
</script>

<input type=text  id="modelloInput" />

现在，当我运行应用程序并在输入框中写一些东西时，我在自动完成框中得到了整个列表。我可以写任何东西，但我总是得到完整的元素列表。

为什么？

【问题讨论】：

您也可以粘贴您的网络服务代码吗？
网址是否正确？如果是，代码肯定会发布。
@JalpeshVadgama 我可以做到这一点，但对网络服务的调用效果很好，因为我得到了我想要的响应，但自动完成不会根据我正在写的内容进行过滤
@JohnReid URL 是正确的，因为我没有从 chrome/firefox 控制台收到错误
它是否过滤列表并仅更改所需的部分？例如，有三个名称 Jalpesh、Vishal 和 Tushar，您键入 Tu 您的服务器端代码应该只返回 tushar

标签： javascript asp.net vb.net autocomplete jquery-autocomplete

【解决方案1】：

我认为您的网络服务代码一定有问题，

您可以使用此基本代码进行自动完成，

$( "input.suggest-user" ).autocomplete({
  source: function( request, response ) {

    $.ajax({
        dataType: "json",
        type : 'Get',
        url: 'yourURL',
        success: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  // hide loading image

        response( $.map( data, function(item) {
            // your operation on data
        }));
      },
      error: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  
      }
    });
  },
  minLength: 3,
  open: function() {

  },
  close: function() {

  },
  focus:function(event,ui) {

  },
  select: function( event, ui ) {

  }
});

或

$("#id").autocomplete(
{
search: function () {},
source: function (request, response)
{
    $.ajax(
    {
        url: ,
        dataType: "json",
        data:
        {
            term: request.term,
        },
        success: function (data)
        {
            response(data);
        }
    });
},
minLength: 2,
select: function (event, ui)
{
    var test = ui.item ? ui.item.id : 0;
    if (test > 0)
    {}
}
});

【讨论】：