Ajax实现在textbox中输入内容，动态从数据库中模糊查询显示到下拉框中

作者：Eve Cole 更新时间：2009-07-06 16:30:03

功能：在文本框中输入内容，动态从数据库模糊查询显示到下拉框，可供选择

1.建立一个aspx页面，html代码

<头>
<标题>WebForm1
<脚本语言=“javascript”>
//城市------------------------------
函数城市结果()
{
var city=document.getElementById("TextBox1");
WebForm1.GetCityList(city.value,get_city_Result_CallBack);
}

函数 get_city_Result_CallBack(响应)
{
if (response.value != null)
{
//调试器;
document.getElementById("DropDownList1").style.display="block";
document.getElementById("DropDownList1").length=0;
var ds = 响应.值;
if(ds != null && typeof(ds) == "object" && ds.Tables != null)
{
for(var i=0; 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));
}
}
}
别的
{
document.getElementById("DropDownList1").style.display="none";
}
返回
}

函数 getData()
{
var Province=document.getElementById("DropDownList1");
var pindex = 省份.selectedIndex;
var pValue = Province.options[pindex].value;
var pText = Province.options[pindex].text;

document.getElementById("<%=TextBox1.ClientID%>").innerText=pText;
}

<正文>

2.cs代码
使用系统；
使用系统集合；
使用 System.ComponentModel；
使用系统数据；
使用系统绘图；
使用系统.Web；
使用 System.Web.SessionState；
使用 System.Web.UI；
使用 System.Web.UI.WebControls；
使用 System.Web.UI.HtmlControls；
使用 System.Data.SqlClient；
名称空间 ajaxselect
{
/**//// <摘要>
/// WebForm1 的摘要描述。
///
公共类WebForm1：System.Web.UI.Page
{
受保护的 System.Web.UI.WebControls.TextBox TextBox1;
受保护的 System.Web.UI.WebControls.DropDownList DropDownList1;

私人无效Page_Load（对象发送者，System.EventArgs e）
{
Ajax.Utility.RegisterTypeForAjax(typeof(WebForm1));
if (!Page.IsPostBack)
{
this.TextBox1.Attributes.Add("onchange", "cityResult();");
this.DropDownList1.Attributes.Add("onclick", "getData();");
}

Web 表单

设计

器生成的代码#region Web 表单设计器生成的代码
覆盖 protected void OnInit(EventArgs e)
{
//
// CODEGEN：ASP.NET Web 窗体设计器需要此调用。
//
初始化组件();
基.OnInit(e);
}

/**//// <摘要>
/// 设计器支持所需的方法 - 请勿修改
/// 使用代码编辑器编辑此方法的内容。
///
私有无效InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);

}
#endregion

获取城市列表#region 获取城市列表
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
公共数据集GetCityList（int省份ID）
{
string sql = "从父亲喜欢'%'的城市中选择*" + Provinceid + "%'";
返回 GetDataSet(sql);
}
#endregion
获取数据集#region 获取数据集
公共静态数据集GetDataSet（字符串sql）
{
字符串 ConnectionString = System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
SqlDataAdapter sda = new SqlDataAdapter(sql, ConnectionString);
数据集 ds = new 数据集();
sda.Fill(ds);
返回ds；
}
#endregion

}
}3.来源代码下载
4.数据库脚本
创建表 [dbo].[城市](
[id] [int] NOT NULL,
[cityID] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL,
[城市] [nvarchar](50) COLLATE Chinese_PRC_CI_AS NULL,
[父亲] [nvarchar](6) COLLATE Chinese_PRC_CI_AS NULL,
约束 [PK_city] 主键聚集
（
[id]ASC
)WITH (IGNORE_DUP_KEY = OFF) ON [主要]
) 关于 [主要]