【发布时间】：2017-08-23 15:41:52
【问题描述】：
我是 webdev、Jquery 和 asp.NET 的新手，我尝试关注其他人的问题，并且已经研究这个问题大约一周了。我似乎无法让它与我的数据库一起使用。
我正在尝试使用 Jquery、C# 和 SQL 数据库为我的 asp.NET 网页上的文本框实现一个简单的自动完成功能。到目前为止，我有一个 C# 函数“Search()”，它可以获取类似于本地字符串的结果。但是我目前不知道如何将输入文本传递给这个 C# 函数。
这是我的 .cs：
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Search(object sender, EventArgs e)
{
List<string> results;
//ListBox1.Items.Clear();
results = OleDb.fDbReadToArray(@"SELECT Project_Name from tProjectNames where Project_Name like '" + Local_String_to_be_passed from asp.NET + "%'");
//foreach (string item in results)
//{
// ListBox1.Items.Add(item);
//}
}
从我在线阅读的内容来看，实现此目的的一个好方法是使用 Jquery 和 ajax 将用户从文本框中输入的内容发布到我的 c# 代码中，然后获取结果。我正在尝试按照 Jquery 示例使用远程数据源进行自动完成 （见https://jqueryui.com/autocomplete/#remote）。
但我正在努力让 Jquery 转到我的 c# 函数。这是我的 asp.NET：
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function () {
$("#ProjectNames").autocomplete({
source: "live_search.aspx.cs/Search()",
select: function (event, ui) {
log("Selected: " + ui.item.value + " aka " + ui.item.id);
}
});
});
</script>
</head>
<body>
<div>
<label for="ProjectNames">Project Names: </label>
<input id="ProjectNames" type ="text" oninput="Search()" />
</div>
</body>
</html>
谁能告诉我如何让用户在输入文本框中输入的内容转到我的 C# 函数，然后将结果发布回 Jquery 建议框？
谢谢
编辑： 这是最终对我有用的解决方案，感谢 Chetan Ranpariya。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="jquery-1.12.4.js"></script>
<script src="jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(function () {
$("#ProjectNames").autocomplete({
source: function (request, response) {
var objdata = JSON.stringify({
obj: {
query: $("#ProjectNames").val()
}
});
$.ajax({
url: "Live_Search1.aspx/Search",
data: objdata,
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function (data) { return data; },
success: function (data) {
response($.map(data.d, function (item) {
return {
label: item,
value: item
}
}))
}
});
}
});
});
});
</script>
</head>
<body>
<form id="form" runat="server">
<div>
<asp:label for="ProjectNames" runat="server">Project Names: </asp:label>
<input ID="ProjectNames" type ="text" runat="server" />
</div>
</form>
</body>
</html>
.cs:
public class Myobj
{
public string query { get; set; }
}
[System.Web.Services.WebMethod]
public static List<string> Search(Myobj obj)
{
List<string> projectList = new List<string>() { "project", "sam", "daniel" };
List<string> results = new List<string>() { };
foreach(string project in projectList)
{
if(project.Contains(obj.query))
{
results.Add(project);
}
}
return results;
}
如果有人对如何在计算上进行改进有任何修改，请告诉我，请记住，项目列表可能会增长到数千个。再次感谢 Chetan Ranpariya！
【问题讨论】：
标签： c# jquery asp.net ajax jquery-ui