[英]ASP.Net MVC + Autocomplete Search not working
我是一个初学者,我正在尝试使用ASP.Net MVC 5开发一个自动完成搜索框。我使用Northwind数据库和Entity Framework 6。
这是我的index.cshtml代码
@model IEnumerable<AutoComplete3.Models.Customers>
<link href="~/Content/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="~/Scripts/jquery-1.9.1.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-ui.js"></script>
<script type="text/javascript">
$(function () {
$("#txtSearch").autocomplete({
source: '@Url.Action("GetCustomers")'
});
});
</script>
@using (@Html.BeginForm())
{
<b>Name : </b>
@Html.TextBox("searchTerm", null, new { @id = "txtSearch" })
<input type="submit" value="Search" />
}
这是我的CustomerController类
public class CustomersController : Controller
{
northwindEntities db = new northwindEntities();
public ActionResult Index()
{
return View(db.Customers);
}
[HttpPost]
public ActionResult Index(string SearchTerm)
{
List<Customers> customers;
if (string.IsNullOrEmpty(SearchTerm))
{
customers = db.Customers.ToList();
}
else
{
customers = db.Customers.Where(c => c.CompanyName.StartsWith(SearchTerm)).ToList();
}
return View(customers);
}
public JsonResult GetCustomers(string term)
{
List<string> customers;
customers = db.Customers.Where(c => c.CompanyName.StartsWith(term)).Select(y => y.CompanyName).ToList();
return Json(customers,JsonRequestBehavior.AllowGet);
}
}
当我通过输入关键字并单击提交按钮搜索记录时,此代码有效。 但是,jQuery脚本无法调用GetCustomer方法。 检查元素显示以下错误。
Uncaught TypeError: $(...).autocomplete is not a function
该文本框应为文本框本身建议“公司名称”。 如何纠正这个问题。
谢谢。
Java脚本
$(document).ready(function () {
$("#txtSearch").autocomplete({
source: function (request, response) {
$.ajax({
url: '@Url.Action("GetCustomers","Home")',
type: "POST",
dataType: "json",
data: { searchTerm: request.term },
success: function (data) {
response($.map(data, function (item) {
return { label: item.CompanyName, value: item.CompanyName };
}))
}
})
},
messages: {
noResults: "", results: ""
},
});
})
视图
@using (@Html.BeginForm())
{
<b>Name : </b>
@Html.TextBox("searchTerm", null, new { @id = "txtSearch" })
<input type="submit" value="Search" />
}
控制者
请使用[HttpPost]更新您的控制器
[HttpPost]
public JsonResult GetCustomers(string searchTerm)
{
List<string> customers;
customers = db.Customers.Where(c => c.CompanyName.StartsWith(term)).Select(y => y.CompanyName).ToList();
return Json(customers,JsonRequestBehavior.AllowGet);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.