利用AjaxControlToolkit实现百度搜索时的下拉列表提示详细步骤
ng> list = new List<string>(count);
// Random rnd = new Random();
// for (int i = 1; i <= count; i++)
// {
// c1 = (char)rnd.Next(65, 90);
// c2 = (char)rnd.Next(97, 122);
// c3 = (char)rnd.Next(97, 122);
// list.Add(prefixText + c1 + c2 + c3);
// }
// return list.ToArray();
//}
}
}
四：完成，运行Web页面即可看到文本框的自动补充效果，需要注意的地方如下：
AutoCompleteExtender控件参数说明：
1.TargetControlID:指定要实现提示功能的控件；
2.ServicePath:WebService的路径，提取数据的方法是写在一个WebService中的；
3.ServeiceMethod:写在WebService中的用于提取数据的方法的名字；
4.MinimumPrefixLength:用来设置用户输入多少字母才出现提示效果；
5.CompletionSetCount:设置提示数据的行数；
6.CompletionInterval:从服务器获取书的时间间隔，单位是毫秒。
WebService.asmx 需要注意的地方：
1.由于该WEB服务是为Ajax框架提供服务的，因此在类声明之前得加上属性声明：
[System.Web.Script.Services.ScriptService]
2.特别需要注意的是GetTextString这个方法。凡是为AutoCompleteExtender控件提供服务的方法都必需完全满足以下三个条件：
A.方法的返回类型必需为：string []；
B.方法的传入参数类型必需为：string , int；
C.两个传入参数名必需为：prefixText , count。
文本框输入的值传递到WebService中：
aspx:
复制代码 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestSearch.aspx.cs" Inherits="TestSearch" %>
<%@ Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript">
function OnTxtPersonInfoKeyDown() {
var val = document.getElementById("<%=TextBox1.ClientID %>").value;
var NameClientID = "<%=AutoCompleteExtender1.ClientID %>";
var acName = $find(NameClientID);
if (acName != null) {
acName.set_contextKey(val);
}
}
function OnTxtPersonInfoKeyDown2() {
var val = document.getElementById("<%=TextBox2.ClientID %>").value;
var NameClientID = "<%=AutoCompleteExtender2.ClientID %>";
var acName = $find(NameClientID);
if (acName != null) {
acName.set_contextKey(val);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="Server" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"
TargetControlID="TextBox1"
CompletionSetCount="10"
EnableCaching="false"
FirstRowSelected="true"
UseContextKey="True"
MinimumPrefixLength="0"
CompletionInterval="100"
ServicePath="WebService.asmx"
ServiceMethod="GetEnglishName">
</asp:AutoCompleteExtender>
<br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:AutoCompleteExtender ID="AutoCompleteExtender2" runat="server"
TargetControlID="TextBox2"
CompletionSetCount="10"
E
// Random rnd = new Random();
// for (int i = 1; i <= count; i++)
// {
// c1 = (char)rnd.Next(65, 90);
// c2 = (char)rnd.Next(97, 122);
// c3 = (char)rnd.Next(97, 122);
// list.Add(prefixText + c1 + c2 + c3);
// }
// return list.ToArray();
//}
}
}
四：完成，运行Web页面即可看到文本框的自动补充效果，需要注意的地方如下：
AutoCompleteExtender控件参数说明：
1.TargetControlID:指定要实现提示功能的控件；
2.ServicePath:WebService的路径，提取数据的方法是写在一个WebService中的；
3.ServeiceMethod:写在WebService中的用于提取数据的方法的名字；
4.MinimumPrefixLength:用来设置用户输入多少字母才出现提示效果；
5.CompletionSetCount:设置提示数据的行数；
6.CompletionInterval:从服务器获取书的时间间隔，单位是毫秒。
WebService.asmx 需要注意的地方：
1.由于该WEB服务是为Ajax框架提供服务的，因此在类声明之前得加上属性声明：
[System.Web.Script.Services.ScriptService]
2.特别需要注意的是GetTextString这个方法。凡是为AutoCompleteExtender控件提供服务的方法都必需完全满足以下三个条件：
A.方法的返回类型必需为：string []；
B.方法的传入参数类型必需为：string , int；
C.两个传入参数名必需为：prefixText , count。
文本框输入的值传递到WebService中：
aspx:
复制代码 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestSearch.aspx.cs" Inherits="TestSearch" %>
<%@ Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript">
function OnTxtPersonInfoKeyDown() {
var val = document.getElementById("<%=TextBox1.ClientID %>").value;
var NameClientID = "<%=AutoCompleteExtender1.ClientID %>";
var acName = $find(NameClientID);
if (acName != null) {
acName.set_contextKey(val);
}
}
function OnTxtPersonInfoKeyDown2() {
var val = document.getElementById("<%=TextBox2.ClientID %>").value;
var NameClientID = "<%=AutoCompleteExtender2.ClientID %>";
var acName = $find(NameClientID);
if (acName != null) {
acName.set_contextKey(val);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="Server" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"
TargetControlID="TextBox1"
CompletionSetCount="10"
EnableCaching="false"
FirstRowSelected="true"
UseContextKey="True"
MinimumPrefixLength="0"
CompletionInterval="100"
ServicePath="WebService.asmx"
ServiceMethod="GetEnglishName">
</asp:AutoCompleteExtender>
<br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:AutoCompleteExtender ID="AutoCompleteExtender2" runat="server"
TargetControlID="TextBox2"
CompletionSetCount="10"
E