c# - 在我的 MVC3 应用程序中使用 jQuery 自动完成

Question

我正在为我的用户制作一个注册表，我希望他们在他们的城市填写。

因此，当他们输入城市名称时，jQuery UI component 的自动完成选项将异步加载。

页面上的示例展示了如何使用 .php 文件，但这如何适合纯 HTTP 解决方案？

我如何获取这些选项？

我有一个使用 Entity Framework 和存储库模式访问的简单表:

table City
------------------
CityId int primary key,
Name nvarchar(256)

Answer 1

自动完成插件将向您使用 ?term=blah 查询字符串参数指定的路径发送 GET 请求。

您需要向您的 Controller 添加一个 Action 来处理此请求，并以 json 形式返回一个匹配值数组。

public ActionResult AutoCompleteCity(string term) {
  var db = new myEFDataContext();
  return Json(db.Cities.Where(city => city.Name.StartsWith(term)).Select(city => city.Name), JsonRequestBehavior.AllowGet);
}

然后在您的 javascript 中像这样连接自动完成功能。

$('#cityTextBoxId').autocomplete({ source: '/Controller/AutoCompleteCity' });