现在的位置: 首页 > 综合 > 正文

AutoCompleteExtender

2013年06月17日 ⁄ 综合 ⁄ 共 5049字 ⁄ 字号 评论关闭

本章介绍AutoCompleteExtender的使用方法。用过Google的朋友都会发现,当我们在搜索框输入关键字的时候,Google会自动列出相关关键字提示。那么用Ajax.net也能做到么?答案是:Of course!

第一步:建立AJAX Control Toolkit Website

本例子只需要一个TextBox控件和一个AutoCompleteExtender组件。拖进设计界面后代码如下所示:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"></ajaxToolkit:AutoCompleteExtender>

第二步:建立WebService

要使用AutoCompleteExtender,我们要通过WebService传递数据。在解决方案资源管理器单击项目-〉添加新项-〉Web服务。我在这里使用了默认的名称,大家有需要自己改吧。

WebService.asmx的代码如下:

using System;using System.Web.Services;

using System.Collections.Generic; 

 ///<summary>

/// WebService 的摘要说明

///</summary>[WebService(Namespace = http://tempuri.org/)]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

[System.Web.Script.Services.ScriptService]

public class WebService : System.Web.Services.WebService

{    

  public WebService ()

  {        

  //如果使用设计的组件,请取消注释以下行        

  //InitializeComponent();    

  }    

   [WebMethod]   

   public string[] GetCompleteList(string prefixText, int count)

  {       

    char c1, c2, c3;       

     if (count == 0)           

      count = 10;       

    List<String> 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();   

  }

}

注意:加亮部分大家要自行添加。[System.Web.Script.Services.ScriptService]一定要加,它告诉.net runtime这个WebService被允许从客户端调用。另外System.Collections.Generic是List的命名空间,List可以理解成物件或类别的集合,我们可以根据特殊条件在List里找到我们所需要的值,是.net 2.0新增加的类。该函数的意思是产生三个随机字母,自动添加在输入字符串的后面。另外prefixText和count这两个参数名称要严格遵守拼写格式,原因以前已经介绍过了。

第三步:设置AutoCompleteExtender

具体设置代码如下: 

<ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"       

  TargetControlID="TextBox1"       

  CompletionSetCount="12"       

  EnableCaching="true"       

  MinimumPrefixLength="3"       

  ServicePath="WebService.asmx"       

  ServiceMethod="GetCompleteList">

</ajaxToolkit:AutoCompleteExtender>

 

TargetControlID是目标控件ID,这里是TextBox1。CompletionSetCount是指列表列出输入提示的数量。EnableCaching指是否启用缓存,建议启动。MinimumPrefixLength是指输入多少个字符后开始列出输入提示列表。ServicePath是指Web服务的文件名,这里是WebService.asmx。ServiceMethod是指调用Web服务的函数名,这里是GetCompleteList。

OK,运行!效果如下图:

 

结束:

本章介绍了AutoCompleteExtender的使用方法。在本例子中,我只是通过简单的算法产生随机字母并添加到输入字符串后面。这种方法实用性不大,建议大家在实际使用时自行编写更复杂的算法,让AutoCompleteExtender产生更实用的效果。

-------------------------------------------------------------------------------------------------------------------

另外,自己用的一套格式
这是autocomplete中的webservice 的cs代码

using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
using System.Web.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Collections.Generic;

/// <summary>
/// W_SAutoComplete
/// </summary>
///
[ScriptService()]
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class W_SAutoComplete : System.Web.Services.WebService {

    public W_SAutoComplete () {

        //
        //InitializeComponent();
    }

    [WebMethod]
    public string[] GetDeptName(string prefixText)
    {
        List<string> suggestions = new List<string>();
        try
        {
            using (SqlConnection con = new SqlConnection(WebConfigurationManager.ConnectionStrings["SQLCON"].ConnectionString))
            {
                SqlCommand cmd = new SqlCommand();
                cmd.CommandText = "SELECT dept_name FROM deptcode where dept_name like '"+prefixText+"%'";
                cmd.Parameters.AddWithValue("@prefixTextName", prefixText);
                cmd.Connection = con;//一定要加上,不然会出现错误的
                con.Open();
                SqlDataReader sdr = null;
                sdr = cmd.ExecuteReader();
                    while (sdr.Read())
                    {
                        suggestions.Add(sdr.GetSqlString(0).Value);
                    }
            
                return suggestions.ToArray();
            }
        }
        catch (System.Exception ex)
        {
            suggestions.Add(ex.Message);
            return suggestions.ToArray();
        }
    }
   
}

default页面中的代码为:

<%@ Page AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form runat="server">
        <asp:ScriptManager runat="server" >
        <Services>
        <asp:ServiceReference Path="W_SAutoComplete.asmx" />
        </Services>
        </asp:ScriptManager>
        <div>
            <asp:TextBox runat="server"></asp:TextBox>
            <ajaxToolkit:AutoCompleteExtender runat="server" Enabled="True"
                TargetControlID="txtDept" ServiceMethod="GetDeptName" ServicePath="W_SAutoComplete.asmx" MinimumPrefixLength="1" CompletionSetCount="20" CompletionInterval="1000">
            </ajaxToolkit:AutoCompleteExtender>
            &nbsp;
        </div>
    </form>
</body>
</html>

抱歉!评论已关闭.