[英]how to create textbox list control?
我有一个用于输入employeename的文本框。当用户键入employeename时,我想从数据库中以该键入的字母开头列出所有雇员,就像一个下拉列表一样
我不希望任何第三方控制。是否有任何更容易理解的方法?
您可以使用此库,只需编写好代码即可,非常简单
http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/AutoComplete/AutoComplete.aspx
首先,我们将使用将消耗ASP.NET Web Service
Jquery UI Auocomplete
(假设Name.asmx
)。
添加对Jquery UI CSS
文件的引用
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
现在添加对Jquery library
引用
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
添加对Jquery UI
引用
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
假设您有一个带有auto
类的文本框
<asp:TextBox ID="tbAuto" class="auto" runat="server">
</asp:TextBox>
现在,我们将编写一个脚本,该脚本会将textbox
键入的每个单个字母传递给我们的Web Service
(Name.asmx)
。
<script type="text/javascript">
$(function() {
$(".auto").autocomplete({
source: function(request, response) {
$.ajax({
url: "Name.asmx/FetchNames",
data: "{ 'name': '" + request.term + "' }",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function(data) { return data; },
success: function(data) {
response($.map(data.d, function(item) {
return {
value: item.Name
}
}))
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
},
minLength: 2
});
});
</script>
最后是C#
的Web Service
[WebMethod]
public List<string> FetchNames(string name)
{
//Write your query to get names that begin with the letter passed as parameter and return results
//Remember return the results by converting it to List.
}
希望它会有所帮助。
如果有问题,请回复。
编辑:
这是查询。
SqlDataReader rdr = null;
SqlConnection con = null;
SqlCommand cmd = null;
List<string> empName=new List<string>();
try
{
// Open connection to the database
string ConnectionString = "server=yourservername;uid=sa;"+
"pwd=yourpswd; database=yourdatabase";
con = new SqlConnection(ConnectionString);
con.Open();
// Set up a command with the given query and associate
// this with the current connection.
string CommandText = "SELECT FirstName" +
" FROM Employees" +
" WHERE (FirstName LIKE +name%)";
cmd = new SqlCommand(CommandText);
cmd.Connection = con;
// Execute the query
rdr = cmd.ExecuteReader();
while(rdr.Read())
{
empName.Add(rdr["FirstName"].ToString());
}
return empName;
}
catch(Exception ex)
{
// Print error message
}
注意:我尚未对此进行测试,但我认为,根据您的需要进行一些更改即可正常工作! 同时尝试改进此代码
您可以使用jquery自动完成api:
$(document).ready(function () {
$("#<%=ApplicationSearchResult.ClientID %>").autocomplete({ //applicationSearchResult is your textbox
source: function (request, response) {
$.ajax({
type: "POST",
url: "Dashboard.aspx/GetTreeNodesByText", // the function you have to call to bring you the data
data: "{'text': '" + request.term + "'}", // the letter the user entered in the textbox
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
response(data.d);
}
});
},
minLength: 1
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.