ASP.NET MVC中的自动完成文本框

本文介绍了ASP.NET MVC中的自动完成文本框的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

大家好，希望你们所有人都很好...... i是MVC的新手，我遇到了一个问题，我想用jquery用我的硬编码数据自动完成文本框，但是没有取得任何成功在这个问题上，我添加了jquery autocomplete API的引用，但没有任何事情可以帮助我克服这个问题..提前谢谢 我有什么试过： 型号：

Hi everyone hope all of you are good... i am new to MVC and i am facing a problem i want to autocomplete the textbox with my hardcoded data using jquery but do not get any success in this matter, i have added the reference of jquery autocomplete API but nothing happened kindly help me to overcome this issue .. thankx in advance What I have tried: Model:

public class Locations { public int Id { get; set; } public string Name { get; set; } public List<Locations> locations = new List<Locations>() { new Locations() {Id = 1, Name = "London"}, new Locations() {Id = 2, Name = "Walles"}, new Locations() {Id = 3, Name = "Birmingham"}, new Locations() {Id = 4, Name = "Edinburgh"}, new Locations() {Id = 5, Name = "Glasgow"}, new Locations() {Id = 6, Name = "Liverpool"}, new Locations() {Id = 7, Name = "Bristol"}, new Locations() {Id = 8, Name = "Manchester"}, new Locations() {Id = 9, Name = "NewCastle"}, new Locations() {Id = 10, Name = "Leeds"}, new Locations() {Id = 11, Name = "Sheffield"}, new Locations() {Id = 12, Name = "Nottingham"}, new Locations() {Id = 13, Name = "Cardif"}, new Locations() {Id = 14, Name = "Cambridge"}, new Locations() {Id = 15, Name = "Bradford"}, new Locations() {Id = 16, Name = "Kingston Upon Hall"}, new Locations() {Id = 17, Name = "Norwich"}, new Locations() {Id = 18, Name = "Conventory"} }; }

控制器：

Controller:

public class DefaultController : Controller { public ActionResult Index() { return View(); } public JsonResult Search(string term) { Locations l = new Locations(); List<string> Loc; Loc = l.locations.Where(x => x.Name.StartsWith(term)).Select(x => x.Name).Distinct().ToList(); return Json(Loc, JsonRequestBehavior.AllowGet); } }

浏览：

View:

@model IEnumerable<SearchBox.Models.Locations> @using SearchBox.Models @{ ViewBag.Title = "Index"; } <link href="~/Content/jquery-ui.css" rel="stylesheet" /> <script src="~/Content/jquery-ui.js"></script> <script type="text/javascript"> $(function () { $('#searchText').autocomplete({ source: '@Url.Action("Search")' }); }) </script> <h2>Search Demo</h2> @using (Html.BeginForm()) { <input type = "text" id="searchText" name="searchText" /> <input type="submit" value="Search" /> }

推荐答案

（function（）{ (function () {

（'＃searchText' ）.autocomplete（{来源：'@ Url.Action（搜索）'}）; }）< / script> < h2>搜索演示< / h2> @using（Html.BeginForm（）） {< input type =textid =searchTextname =searchText/> < input type =submitvalue =搜索/> } ('#searchText').autocomplete({ source: '@Url.Action("Search")' }); }) </script> <h2>Search Demo</h2> @using (Html.BeginForm()) { <input type = "text" id="searchText" name="searchText" /> <input type="submit" value="Search" /> }

您需要为其指定显示元素和ID的属性： You would need to specify the properties for display element and id for it :