AutoCompleteExtender的使用

AutoCompleteExtender 自動完成擴展, 配合TextBox使用功能類似現在google中輸入搜索字,則在TextBox下出來下拉框顯示搜索目標中的項目
這個擴展控件需要配合Web Service使用,所以涉及了點web Service的使用(這裏只簡單談下,等用熟了再仔細談下web service的內容)
先介紹下AutoCompleteExtender的幾個關鍵屬性：
a,TargetControlID 這個屬性是所有AjaxControlToolkit的共同屬性,就是擴展目標控件ID(官方這麼說的吧)
b.CompletionSetCount 這個屬性是設置顯示下拉結果的條數默認爲10吧
c.MinimumPrefixTextLength 這個屬性是設置輸入幾個字符的長度後調用webService中的方法顯示下拉列表
d.ServicePath 這個屬性設置需要調用的web Service路徑
e.ServiceMethod 這個屬性設置需要調用的web Service中的方法(函數)
f.EnableCaching：是否在客戶端緩存數據,默認爲true
g.CompletionInterval：從服務器讀取數據的時間間隔,默認爲1000,單位：毫秒
注：如果習慣用可視控件設置屬性,則a屬性在AutoCompleteExtender中設置,其他屬性則設置了TargetControlId後,在相應的TargetControl中會多出來個Extenders屬性中設置,如果習慣手寫代碼,則在AutoCompleteExtender代碼屬性中設置。
例子: 1.新建一個頁面,加入ScriptManager控件一個TextBox控件一個AutoCompleteExtender控件
2.新建立一個webService,添加一個[WebMethod]方法
[WebMethod] public string[] GetString(string prefixText, int count){ System.Collections.Generic.List<string> list = new System.Collections.Generic.List<string>(count); System.Data.DataSet ds = new System.Data.DataSet(); //這裏是我在數據庫中取數據的代碼其中SqlHelper類是項目中的取數據基類 //string strSql = string.Format("SELECT TOP {0} NAME FROM CengWei WHERE NAME LIKE '{1}%' ORDER BY NAME",count,prefixText); //ds = SqlHelper.Query(strSql); //for (int i = 0; i < ds.Tables[0].Rows.Count; i++) //{ // list.Add(ds.Tables[0].Rows[i][0].ToString()); //} for (int i = 0; i < count; i++) { list.Add(prefixText+i.ToString()); } return list.ToArray(); }

其中：必須在webService的類上面添加
[System.Web.Script.Services.ScriptService]
示例代碼：webService是在數據庫中的一個字段中取數據
頁面代碼：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test2.aspx.cs" Inherits="test2" %> <%@ Register Assembly="CrystalDecisions.Web, Version=10.2.3600.0, Culture=neutral, PublicKeyToken=692fbea5521e1304" Namespace="CrystalDecisions.Web" TagPrefix="CR" %> <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>DropDownExtender簡單練習</title> <link href="/aspnet_client/System_Web/2_0_50727/CrystalReportWebFormViewer3/css/default.css" mce_href="aspnet_client/System_Web/2_0_50727/CrystalReportWebFormViewer3/css/default.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="True" EnableScriptLocalization="True"> </asp:ScriptManager> <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox> <cc1:AutoCompleteExtender ID="AutoCompleteExtender2" runat="server" MinimumPrefixLength="1" ServiceMethod="GetString" ServicePath="AutoComplete.asmx" TargetControlID="TextBox2"> </cc1:AutoCompleteExtender> </form> </body> </html>
webService代碼：
using System; using System.Web; using System.Collections; using System.Web.Services; using System.Web.Services.Protocols; /// <summary> /// AutoComplete 的摘要說明 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] //下面是必須的，否則功能無法實現 [System.Web.Script.Services.ScriptService] public class AutoComplete : System.Web.Services.WebService { public AutoComplete () { //如果使用設計的組件，請取消註釋以下行 //InitializeComponent(); } [WebMethod] public string HelloWorld() { return "Hello World"; } [WebMethod] public string[] GetString(string prefixText, int count){ System.Collections.Generic.List<string> list = new System.Collections.Generic.List<string>(count); System.Data.DataSet ds = new System.Data.DataSet(); //這裏是我在數據庫中取數據的代碼其中SqlHelper類是項目中的取數據基類 //string strSql = string.Format("SELECT TOP {0} NAME FROM CengWei WHERE NAME LIKE '{1}%' ORDER BY NAME",count,prefixText); //ds = SqlHelper.Query(strSql); //for (int i = 0; i < ds.Tables[0].Rows.Count; i++) //{ // list.Add(ds.Tables[0].Rows[i][0].ToString()); //} for (int i = 0; i < count; i++) { list.Add(prefixText+i.ToString()); } return list.ToArray(); } }

後面是我自己參考別人以後得出結論

OnClientItemSelected事件是激發的客戶端的事件(在這裏綁定是OnArchivesIDItemSelected方法)

//實現選中智能提示時所激發的事件 function OnArchivesIDItemSelected(source,eventArgs) { var archivesID=eventArgs.get_text();//獲取在下拉列表中被選中的值 Foreground_DataStatistics_DayDataReport.GetCardnoAndSiteNameByArchivesID(archivesID,ShowSiteName);//用ajax方法調用後臺代碼的方法 } //顯示站點名稱與通信卡號 function ShowSiteName(response) { var table=response.value; if(table.Rows.length<=0) { alert("無記錄"); return; } document.all.txtMonitorySiteName.value=table.Rows[0].SiteName;//修改服務器控件的值 document.all.txtCommunicationCardno.value=table.Rows[0].CommunicationCardno;//修改服務器控件的值 }
詳細出處參考：http://www.jb51.net/article/16320.htm

xiongshao1943

發佈了32 篇原創文章 · 獲贊 5 · 訪問量 3萬+

私信關注

AutoCompleteExtender的使用

dotnet C# 創建 X11 應用時設置窗口背景顏色

vue3組件通信與props

sapui5

Alpine Linux apk add DNS lookup error

部分JDK版本的發佈時間

工作中用到的腳本合集

合併代碼時Beyond Compare設置

Navicat安裝與激活教程

go語言 defer延遲機制

華爲交換機配置實驗項目筆記

用三層架構將數據綁定到TreeView

數據綁定到TreeView

sql server 2005: 查看分區表的分區範圍

關於GridView數據導到Excel中

amcharts在asp.net中的應用

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結