jQuery自動完成不起作用

Question

我正在嘗試使用數據庫中的自動完成源向輸入框（我在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" />

現在，當我運行該應用程序並在輸入框中寫一些內容時，我在自動完成框中獲得了整個列表。 我可以編寫所有內容，但總會得到全部元素列表。

為什么？

Answer 1

我認為您的網絡服務代碼中一定存在一些問題，

您可以將此基本代碼用於autoComplete，

$( "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)
    {}
}
});