自動完成文本框在C＃和MVC

Question

喜一切，感謝您的幫助，

我需要自動完成與C＃和MVC建議文本框。

視圖中的文本框爲：

<div class="col-lg-3 col-md-3 hidden-sm hidden-xs" style="margin-top:2%;"> 
    <input type="text" class="formLocator" value="Milano" data-date-end-date="0d" id="textLocator" name="searchstring"> 
    <h4 class="FormTextLocator">Where</h4> 
</div> 
<div class="hidden-lg hidden-md col-sm-3 col-xs-12" style="margin-top:2%;"> 
    <input type="text" class="formLocator" value="Milano" data-date-end-date="0d" id="textLocator" name="searchstring"> 
    <h4 class="FormTextLocator">Where</h4> 
</div> 

我創建了一個JavaScript代碼爲這個文本框：

$(function() 
{ 
    $("#textLocator").autocomplete(
    { 
     source: "/Home/AutocompleteSuggestions", 
     minLength: 1, 
     select: function (event, ui) 
     { 
      if (ui.item) 
      { 
       $("#textLocator").val(ui.item.value); 
       $("form").submit(); 
      } 
     } 
    }); 
}); 

和相關的控制器是：

public JsonResult AutocompleteSuggestions(string searchstring) 
{ 
    var db = new TocFruit(); 
    var suggestions = from s in db.city select s.name; 
    var namelist = suggestions.Where(n => n.ToString().StartsWith(searchstring.ToLower())); 
    return Json(namelist, JsonRequestBehavior.AllowGet); 
} 

但所有這不起作用，但我不明白我做錯了什麼。

感謝所有，

羅伯託

Answer 1

Jquery UI AutoComplete in MVC

檢查上面的鏈接

也提點按你的代碼中有2個文本框與同id

Answer 2

OK 。現在有了你的幫助，控制器返回正確的值列表，但是文本框不顯示值。新的代碼是這麼寫的：

現在的代碼是這麼寫的：

的Javascript

$(document).ready(function() { 
    $("#textLocator").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       url: "/Home/AutocompleteSuggestions", 
       type: "POST", 
       dataType: "json", 
       data: { term: request.term }, 
       success: function (data) { 
        response($.map(data, function (item) { 
         return { label: item.name, value: item.name }; 
        })) 
       } 
      }) 
     }, 
     messages: { 
      noResults: "", results: "" 
     } 
    }); 
}); 

HTML

<div class="col-lg-3 col-md-3 hidden-sm hidden-xs" style="margin-top:2%;"> 
    <input type="text" class="formLocator" value="Milano" data-date-end-date="0d" id="textLocator" name="searchstring"> 
    <h4 class="FormTextLocator">dove</h4> 
</div> 

控制器

public JsonResult AutocompleteSuggestions(string term) 
{ 
    var db = new TocFruit(); 
    var suggestions = from s in db.city select s.name; 
    var namelist = suggestions.Where(n => n.ToString().ToLower().StartsWith(term.ToLower())); 
    return Json(namelist, JsonRequestBehavior.AllowGet); 
} 

非常感謝你