Ajax implements two-level drop-down box interaction applications

<Asp: DropDownList onChange = "GetChange (this);" id = "drp1" runat = "server"> </asp: DropDownList>
<Asp: DropDownList id = "drp2" runat = "server"> </asp: DropDownList>

Js Script: return data
Function GetChange (drp)
{
Var num = drp. options [drp. selectedIndex]. value;
WebForm3.GetDrp (num, drp_CallBack );
}
Function drp_CallBack (response)
{
If (response. error! = Null)
{
Alert (response. error );
Return;
}
Var drp = document. getElementById ("<% = drp2.ClientID %> ");
VaR DATA = response. value;
If (Data = NULL | typeof (data )! = 'Object ')
{
Return;
}
DRP. Options. Length = 0;
For (I = 0; I <data. length; I ++)
{
Var o = data [I];
Drp. options [drp. options. length] = new Option (data [I], data [I]);
}
}

Background code implementation
Private void Page_Load (object sender, System. EventArgs e)
{
// Place user code here to initialize the page
Ajax. Utility. RegisterTypeForAjax (typeof (ZKMarketing. WebForm3 ));
If (! Page. IsPostBack)
{
For (int I = 5; I <11; I ++)
Drp1.Items. Add (new ListItem (I. ToString (), I. ToString ()));
Drp2.Items. Add (new ListItem ("select", "-1 "));
}
}
[Ajax. AjaxMethod ()]
Public ArrayList GetDrp (int num)
{
ArrayList al = new ArrayList (num );
Al. Clear ();
For (int I = 0; I <num; I ++)
{
ListItem li = new ListItem (I. ToString (), I. ToString ());
Al. Add (li );
}
Return al;
}

You also need to set the web. Config file,
<HttpHandlers>
<Add verb = "POST, GET" path = "ajax/*. ashx" type = "Ajax. PageHandlerFactory, Ajax"/>
</HttpHandlers>

The above is a test page when I was working on a specific project. because it was the first time, I wrote such a simple test page to implement AJAX, now, the functions of a specific project are basically completed.