web.config 配置:
<httpHandlers>
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/><!--Ajax-->
</httpHandlers>
前台代码:
<!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>ajax demo</title>
<SCRIPT language="javascript">
//城市------------------------------
function cityResult() {
var city = document.getElementById("DropDownList1");
WebForm.GetCityList(city.value, get_city_Result_CallBack);
}
function get_city_Result_CallBack(response) {
if (response.value != null) {
//debugger;
document.all("DropDownList2").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.all("DropDownList2").options.add(new Option(name, id));
}
}
}
return
}
//市区----------------------------------------
function areaResult() {
var area = document.getElementById("DropDownList2");
WebForm.GetAreaList(area.value, get_area_Result_CallBack);
}
function get_area_Result_CallBack(response) {
if (response.value != null) {
document.all("DropDownList3").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].area;
var id = ds.Tables[0].Rows[i].areaID;
document.all("DropDownList3").options.add(new Option(name, id));
}
}
}
return
}
function getData() {
var province = document.getElementById("DropDownList1");
var pindex = province.selectedIndex;
var pValue = province.options[pindex].value;
var pText = province.options[pindex].text;
var city = document.getElementById("DropDownList2");
var cindex = city.selectedIndex;
var cValue = city.options[cindex].value;
var cText = city.options[cindex].text;
var area = document.getElementById("DropDownList3");
var aindex = area.selectedIndex;
var aValue = area.options[aindex].value;
var aText = area.options[aindex].text;
var txt = document.getElementById("TextBox1");
document.getElementById("<%=TextBox1.ClientID%>").innerText = "省:" + pValue + "|" + pText + "市:" + cValue + "|" + cText + "区:" + aValue + "|" + aText;
}
</SCRIPT>
</head>
<body ms_positioning="GridLayout">
<form id="Form1" method="post" runat="server">
<TABLE id="Table1" style="Z-INDEX: 101; LEFT: 96px; POSITION: absolute; TOP: 32px" cellSpacing="1" cellPadding="1" width="300" border="1" bgColor="#ccff66">
<TR>
<TD>省市</TD>
<TD><asp:dropdownlist id="DropDownList1" runat="server"></asp:dropdownlist></TD>
</TR>
<TR>
<TD>城市</TD>
<TD><asp:dropdownlist id="DropDownList2" runat="server"></asp:dropdownlist></TD>
</TR>
<TR>
<TD>市区</TD>
<TD><asp:dropdownlist id="DropDownList3" runat="server"></asp:dropdownlist></TD>
</TR>
</TABLE>
<asp:TextBox id="TextBox1" style="Z-INDEX: 102; LEFT: 416px; POSITION: absolute; TOP: 48px" runat="server" Width="424px"></asp:TextBox>
<INPUT style="Z-INDEX: 103; LEFT: 456px; WIDTH: 56px; POSITION: absolute; TOP: 96px; HEIGHT: 24px" type="button" value="test" οnclick="getData();">
</form>
</body>
</html>
后台代码:
public partial class WebForm : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Ajax.Utility.RegisterTypeForAjax(typeof(WebForm));
if (!Page.IsPostBack)
{
this.DropDownList1.DataSource = WebForm.GetProvinceList();
this.DropDownList1.DataTextField = "province";
this.DropDownList1.DataValueField = "provinceID";
this.DropDownList1.DataBind();
this.DropDownList1.Attributes.Add("onchange", "cityResult();");
this.DropDownList2.Attributes.Add("onchange", "areaResult();");
}
}
#region GetProvinceList
public static DataSet GetProvinceList()
{
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn("provinceID", System.Type.GetType("System.Int16"));
dt.Columns.Add(dc);
dc = new DataColumn("province", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
DataRow dr = dt.NewRow();
dr["provinceID"] = 1; dr["province"] = "河北"; dt.Rows.Add(dr);
dr = dt.NewRow();
dr["provinceID"] = 2; dr["province"] = "河南"; dt.Rows.Add(dr);
dr = dt.NewRow();
dr["provinceID"] = 3; dr["province"] = "江西";
dt.Rows.Add(dr);
DataSet Result_ds = new DataSet();
Result_ds.Tables.Add(dt);
return Result_ds;
}
#endregion
#region GetCityList
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public DataSet GetCityList(int provinceid)
{
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn("cityID", System.Type.GetType("System.Int16"));
dt.Columns.Add(dc);
dc = new DataColumn("city", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
DataRow dr = null;
switch (provinceid)
{
case 1:
dr = dt.NewRow();
dr["cityID"] = 1; dr["city"] = "沧州";dt.Rows.Add(dr);
dr = dt.NewRow();
dr["cityID"] = 2; dr["city"] = "泊头";dt.Rows.Add(dr);
break;
case 2:
dr = dt.NewRow();
dr["cityID"] = 3; dr["city"] = "商丘";dt.Rows.Add(dr);
dr = dt.NewRow();
dr["cityID"] = 4; dr["city"] = "周口";dt.Rows.Add(dr);
break;
case 3:
dr = dt.NewRow();
dr["cityID"] = 5; dr["city"] = "南昌";dt.Rows.Add(dr);
dr = dt.NewRow();
dr["cityID"] = 6; dr["city"] = "九江";dt.Rows.Add(dr);
break;
}
DataSet Result_ds = new DataSet();
Result_ds.Tables.Add(dt);
return Result_ds;
}
#endregion
#region GetAreaList
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public DataSet GetAreaList(int cityid)
{
DataTable dt = new DataTable();
DataColumn dc;
dc = new DataColumn("areaID", System.Type.GetType("System.Int16"));
dt.Columns.Add(dc);
dc = new DataColumn("area", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
DataRow dr = null;
switch (cityid)
{
case 1:
dr = dt.NewRow();
dr["areaID"] = 1; dr["area"] = "沧州村"; dt.Rows.Add(dr);
break;
case 2:
dr = dt.NewRow();
dr["areaID"] = 2; dr["area"] = "泊头村"; dt.Rows.Add(dr);
break;
case 3:
dr = dt.NewRow();
dr["areaID"] = 3; dr["area"] = "商丘村"; dt.Rows.Add(dr);
break;
case 4:
dr = dt.NewRow();
dr["areaID"] = 4; dr["area"] = "周口村"; dt.Rows.Add(dr);
break;
case 5:
dr = dt.NewRow();
dr["areaID"] = 5; dr["area"] = "南昌村"; dt.Rows.Add(dr);
break;
case 6:
dr = dt.NewRow();
dr["areaID"] = 6; dr["area"] = "九江村"; dt.Rows.Add(dr);
break;
}
DataSet Result_ds = new DataSet();
Result_ds.Tables.Add(dt);
return Result_ds;
}
#endregion
#region GetDataSet
public static DataSet GetDataSet(string sql)
{
string ConnectionString = ConfigurationSettings.AppSettings["ConnectionString"];
SqlDataAdapter sda = new SqlDataAdapter(sql, ConnectionString);
DataSet ds = new DataSet();
sda.Fill(ds);
return ds;
}
#endregion
}