JQuery Autocomplete

Question

I\'ve got a problem with my jQuery autocomplete field. Its some kind of strange.

This is my autocomplete field and script. The response from my mvc function works fine.

Answer 1

$(function () {
  var getData = function (request, response) {
    $.ajax({
      type: "POST",
      contentType: "application/json; charset=utf-8",
      url: "Default.aspx/GetMultiProductList",
      data: "{'term':'" + $("#txtAutoCompleteMulti").val() + "'}",
      dataType: "json",
      success: function (data) {
        response($.map(data.d, function (item) {
          if (item != null)
            return { label: item.label, title: item.value }//value: item.label,
            }))
      },
      error: function (result) {
        alert("Error");
      }
    });
  };
  var selectItem = function (event, ui) { $("#txtAutoCompleteMulti").val(ui.item.value); return false; }
  $("#txtAutoCompleteMulti").autocomplete({
    source: getData,
    select: selectItem,
    _resizeMenu: function () {
      this.menu.element.outerWidth(500);
    },
    search: function (event, ui) { },
    minLength: 1,
    change: function (event, ui) {
      if (!ui.item) {
        $('#txtAutoCompleteMulti').val("")
      }
    },
    select: function (event, ui) {
      $("#txtAutoCompleteMulti").prop('title', ui.item.title)
    },
    autoFocus: true,
    delay: 500
  });
});

 .ui-autocomplete {
            max-height: 300px;
            overflow-y: auto;
            overflow-x: hidden;
        }
        .ui-autocomplete-loading {
            background: url('img/Progress_indicator.gif') no-repeat right center;
        }
        .seachbox {
            border: 1px solid #ccc;
            border-radius: 4px;
            width: 250px;
            padding: 6px 25px 6px 6px;
            transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
        }

   

     

       
Product Name :
       

         
       
     
  

c# code using webmethod