Ajax中 AutoCompleteExtender 的使用方法

控件名:AutoCompleteExtender 

作用:   在文本框输入时,实现动态提示以及自动填写

示例:   在 google 进行搜索时,在文本框会输入提示内容,如图:

 

Ajax实现:

如果你在用Visual Studio 2005,还没有安装 ASPAJAXExtender 的话,请首先安装: 猛击这里下载

这里还要下载 AjaxControlToolkit ,可以下载这里的 dll 文件:猛击这里下载 

方法1:

将 AjaxControlToolkit(.dll) 里的所有控件添加到 vs2005 或 vs2008 的工具栏中:

添加到工具栏中的方法:

     右键工具栏选项卡:添加选项卡 > 命名 > 选项 > 浏览 > 选择dll文件 > 确定

网页中添加如下代码:

<div>

<asp:ScriptManager ID="sm" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="updatePanel1" runat="server" AutoPostback="true">
   <ContentTemplate>
       <asp:TextBox ID="tb" runat="server" Text=""></asp:TextBox>
       <ajax:AutoCompleteExtender ID="googleSa" runat="server" ServicePath="AutoComplete.asmx"
          TargetControlID="tb" ServiceMethod="GetCompletionList">
       </ajax:AutoCompleteExtender>
   </ContentTemplate>
</asp:UpdatePanel>
</div>

 

属性介绍: 

1.TargetControlID:指定将被辅助完成自动输入的控件ID,这里的控件只能是TextBox;
2.ServicePath:指出提供服务的WEB服务路径,若不指出则ServiceMethod表示本页面对应的方法名;
3.ServiceMethod:指出提供服务的方法名;
4.MinimumPrefixLength:指出开始提供提示服务时,TextBox控件应有的最小字符数,默认为3;
5.CompletionSetCount:显示的条数,默认为10;
6.EnableCaching:是否在客户端缓存数据,默认为true;
7.CompletionInterval:从服务器读取数据的时间间隔,默认为1000,单位:毫秒。

注意:

1. webservice 需要声明为 [System.Web.Script.Service.ScriptService]

   这样 Ajax 可以前台调用。

2. 方法的三个条件:需要严格遵守!
   返回类型必需为:string [];参数类型必需为:string  ,   int;
 参数名:prefixText  ,  count。

 

WebService代码: 

[System.Web.Script.Services.ScriptService]

publicclassAutoComplete : System.Web.Services.WebService
{
[WebMethod]
publicstring[] GetCompletionList(stringprefixText,intcount)
{
   if( count == )
      count=10;
   if( prefixText.Equals("xyx") )
      return new string[0];
   List<string> items = new List<string>(count);
   Random random1 = new Random();
   for(int i=0; i<count; i++)
   {
      charc1=(char)random1.Next(65,97);
      charc2=(char)random1.Next(97,122);
      charc3=(char)random1.Next(97,122);
      items.Add(prefixText+c1+c2+c3);
   }
   returnitems.ToArray();
}
}

prefixText :是输入的内容,可以用来检索数据库,查询出以其开头的字符串。将查询出来的字符串以 string[] 形式返回即可。

posted @ 2010-01-28 02:59  XueM  Views(943)  Comments(0Edit  收藏  举报