<HTML>
<HEAD>
<Title> Ajax implementation without any new three linkage drop-down box </title>
<Meta content = "Microsoft Visual Studio. NET 7.1" name = "GENERATOR">
<Meta content = "C #" name = "CODE_LANGUAGE">
<Meta content = "JavaScript" name = "vs_defaultClientScript">
<Meta content = "http://schemas.microsoft.com/intellisense/ie5" name = "vs_targetSchema">
<SCRIPT language = "javascript">
// City ------------------------------
Function cityResult ()
{
Var city = document. getElementById ("DropDownList1 ");
AjaxMethod. 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
}
// City ----------------------------------------
Function areaResult ()
{
Var area = document. getElementById ("DropDownList2 ");
AjaxMethod. 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 = "province:" + pValue + "|" + pText + "City:" + cValue + "|" + cText + "area: "+ 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> province and city </TD>
<TD> <asp: dropdownlist id = "DropDownList1" runat = "server"> </asp: dropdownlist> </TD>
</TR>
<TR>
<TD> city </TD>
<TD> <asp: dropdownlist id = "DropDownList2" runat = "server"> </asp: dropdownlist> </TD>
</TR>
<TR>
<TD> city </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 = "pixel PX"> </asp: TextBox> <INPUT style = "Z-INDEX: 103; LEFT: 456px; WIDTH: 56px; POSITION: absolute; TOP: 96px; HEIGHT: 24px"
Type = "button" value = "test" onclick = "getData ();">
</Form>
</Body>
</HTML> 2. cs code
Using System;
Using System. Collections;
Using System. ComponentModel;
Using System. Data;
Using System. Drawing;
Using System. Web;
Using System. Web. SessionState;
Using System. Web. UI;
Using System. Web. UI. WebControls;
Using System. Web. UI. HtmlControls;
Namespace AjaxTest
{
/** // <Summary>
/// Summary description for WebForm1.
/// </Summary>
Public class WebForm1: System. Web. UI. Page
{
Protected System. Web. UI. WebControls. DropDownList DropDownList1;
Protected System. Web. UI. WebControls. DropDownList DropDownList2;
Protected System. Web. UI. WebControls. TextBox TextBox1;
Protected System. Web. UI. WebControls. DropDownList DropDownList3;
Private void Page_Load (object sender, System. EventArgs e)
{
Ajax. Utility. RegisterTypeForAjax (typeof (AjaxMethod ));
If (! Page. IsPostBack)
{
This. DropDownList1.DataSource = AjaxMethod. GetProvinceList ();
This. DropDownList1.DataTextField = "province ";
This. DropDownList1.DataValueField = "provinceID ";
This. DropDownList1.DataBind ();
This. DropDownList1.Attributes. Add ("onclick", "cityResult ();");
This. DropDownList2.Attributes. Add ("onclick", "areaResult ();");
}
}
Web Form Designer generated code # region Web Form Designer generated code
Override protected void OnInit (EventArgs e)
{
//
// CODEGEN: This call is required by the ASP. NET Web Form Designer.
//
InitializeComponent ();
Base. OnInit (e );
}
/** // <Summary>
/// Required method for Designer support-do not modify
/// The contents of this method with the code editor.
/// </Summary>
Private void InitializeComponent ()
{
This. Load + = new System. EventHandler (this. Page_Load );
}
# Endregion
}
} 3. AjaxMethod
Using System;
Using System. Data;
Using System. Data. SqlClient;
Namespace AjaxTest
{
/** // <Summary>
/// Summary description for AjaxMethod.
/// </Summary>
Public class AjaxMethod
{
GetProvinceList # region GetProvinceList
Public static DataSet GetProvinceList ()
{
String SQL = "select * from province ";
Return GetDataSet (SQL );
}
# Endregion
GetCityList # region GetCityList
[Ajax. AjaxMethod (Ajax. HttpSessionStateRequirement. Read)]
Public DataSet GetCityList (int provinceid)
{
String SQL = "select * from city where father =" + provinceid;
Return GetDataSet (SQL );
}
# Endregion
GetAreaList # region GetAreaList
[Ajax. AjaxMethod (Ajax. HttpSessionStateRequirement. Read)]
Public DataSet GetAreaList (int cityid)
{
String SQL = "select * from area where father =" + cityid;
Return GetDataSet (SQL );
}
# Endregion
GetDataSet # region GetDataSet
Public static DataSet GetDataSet (string SQL)
{
String ConnectionString = System. Configuration. ConfigurationSettings. etettings ["ConnectionString"];
SqlDataAdapter sda = new SqlDataAdapter (SQL, ConnectionString );
DataSet ds = new DataSet ();
Sda. Fill (ds );
Return ds;
}
# Endregion
}
} 4. web. config
<HttpHandlers>
<Add verb = "POST, GET" path = "ajax/*. ashx" type = "Ajax. PageHandlerFactory, Ajax"/>
</HttpHandlers> 5. Download ajax. dll/Files/singlepine/Ajax.rar