下载后添加引用 Ajax.dll
功能：在textbox中输入内容，动态从数据库模糊查询显示到下拉框中，以供选择
1.建立一aspx页面，html代码
<%@ Page Language="C#" AutoEventWireup="true" Codebehind="WebForm1.aspx.cs" Inherits="Web.WebForm1" %><HTML> <HEAD> <title>WebForm1</title> <SCRIPT language="javascript"> //城市------------------------------ function cityResult() 
{ 
var city=document.getElementById("TextBox1"); WebForm1.GetCityList(city.value,get_city_Result_CallBack);
} function get_city_Result_CallBack(response) { var city=document.getElementById("TextBox1"); if (response.value != null)
{ //debugger; document.getElementById("DropDownList1").style.display="block"; document.getElementById("DropDownList1").length=0; var ds = response.value; if(ds != null && typeof(ds) == "object" && ds.Tables != null) { for(var i=0; i<ds.Tables[0].Rows.length; i++) { var name=ds.Tables[0].Rows[i].city; var id=ds.Tables[0].Rows[i].cityID; document.getElementById("DropDownList1").options.add(new Option(name,id));
} } } else { document.getElementById("DropDownList1").style.display="none"; } return } function getData() { var province=document.getElementById("DropDownList1"); var pindex = province.selectedIndex; var pValue = province.options[pindex].value; var pText = province.options[pindex].text; document.getElementById("<%=TextBox1.ClientID%>").innerText=pText; } </SCRIPT> </HEAD> <body> <form id="Form1" method="post" runat="server"> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <br> <asp:DropDownList ID="DropDownList1" runat="server" Width="192px" style="display:none"></asp:DropDownList> </form> </body></HTML>
2后台代码
using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;using System.Web.Services;using OG.DBUtility;namespace Web{ public partial class WebForm1 : System.Web.UI.Page { private void Page_Load(object sender, System.EventArgs e) { Ajax.Utility.RegisterTypeForAjax(typeof(WebForm1)); if (!Page.IsPostBack) { this.TextBox1.Attributes.Add("onchange", "cityResult();"); this.DropDownList1.Attributes.Add("onclick", "getData();"); } }
Web Form Designer generated code GetCityList GetDataSet }}
3.源代码下载 4.数据库脚本CREATE TABLE [dbo].[city]( [id] [int] NOT NULL, [cityID] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL, [city] [nvarchar](50) COLLATE Chinese_PRC_CI_AS NULL, [father] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL, CONSTRAINT [PK_city] PRIMARY KEY CLUSTERED ( [id] ASC)WITH (IGNORE_DUP_KEY = OFF) ON [PRIMARY]) ON [PRIMARY]
5：添加配置文件
<httpHandlers>
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/>
</httpHandlers>