The front-end uses AJAX to directly call the back-end method. Some old people post and ask questions. There is nothing to do with an example.
CasMenu. aspx page:
Copy codeThe Code is as follows:
<% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "CasMenu. aspx. cs" Inherits = "_ Default" %>
<! 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 id = "Head1" runat = "server">
<Title> Porschev -- foreground JS (Jquery) calls the cascading menu of the background method </title>
<Script src = "js/jquery-1.3.2-vsdoc.js" type = "text/javascript"> </script>
<Script type = "text/javascript">
$ (Function (){
$ ("# SelPro"). change (function () {// change event in the province drop-down menu
Var params = '{str: "' + $ (this). val () + '"}'; // The parameter name must be consistent with the parameter name of the background method.
$. Ajax ({
Type: "POST", // submission method
Url: "CasMenu. aspx/ShowCity", // submitted page/method name
Data: params, // parameter (if no parameter exists: null)
DataType: "text", // type
ContentType: "application/json; charset = UTF-8 ",
BeforeSend: function (XMLHttpRequest ){
$ ('# TipsDiv'). text ("querying ...");
},
Success: function (msg ){
$ ('# TipsDiv'). text ("query successful! ");
$ ("# SelCity option"). each (function (){
$ (This). remove (); // remove the original item
});
$ ("<Option value = '0' >== select ===</option>"). appendTo ("# selCity"); // Add a default item
$ (Eval ("(" + msg + ")"). d). appendTo ("# selCity"); // Add the returned items to the drop-down list.
},
Error: function (xhr, msg, e ){
Alert ("error ");
}
});
});
});
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
Porschev -- foreground JS (Jquery) calls the cascading menu of the background method <br/>
<Br/>
<Select id = "selPro" name = "selPro">
<% = StrPro %>
</Select> province (municipality)
<Select id = "selCity" name = "selCity">
<Option value = "0" >== select ==</option>
</Select> (city)
</Div>
<Div id = "tipsDiv">
</Div>
</Form>
</Body>
</Html>
CasMenu. aspx. cs
Copy codeThe Code is as follows:
Using System;
Using System. Collections. Generic;
Using System. Linq;
Using System. Web;
Using System. Web. UI;
Using System. Web. UI. WebControls;
Using CasMenuModels;
Using CasMenuBLL;
Using System. Text;
Public partial class _ Default: System. Web. UI. Page
{
Public static string strPro = string. Empty; // province drop-down list
Public static string strCity = string. Empty; // city drop-down list
Protected void Page_Load (object sender, EventArgs e)
{
If (! IsPostBack)
{
}
ShowPro ();
}
# Region # province drop-down list box
/// <Summary>
/// Province drop-down list box
/// </Summary>
/// <Returns> </returns>
Public string ShowPro ()
{
StringBuilder str = new StringBuilder (); // obtain the set of all provinces
List <CasMenuModels. Province> list = new CasMenuBLL. ProvinceManager (). GetAllProvince (); // Add an initial entry
Str. Append ("<option value = \"");
Str. Append ("0 ");
Str. Append ("\"> ");
Str. Append ("= select = ");
Str. Append ("</option> ");
// Cyclically append a province drop-down item
Foreach (CasMenuModels. Province p in list)
{
Str. Append ("<option value = \"");
Str. Append (p. ProvinceId );
Str. Append ("\"> ");
Str. Append (p. ProvinceName );
Str. Append ("</option> ");
}
Return strPro = str. ToString ();
}
# Endregion # region # city drop-down list box
/// <Summary>
/// City drop-down list box
/// </Summary>
/// <Param name = "str"> province ID </param>
/// <Returns> </returns>
[System. Web. Services. WebMethod ()]
Public static string ShowCity (string str) // The method is static.
{
StringBuilder strCi = new StringBuilder ();
If (str = "0") // is the initial item.
{
StrCi. Append ("<option value = \"");
StrCi. Append ("select ");
StrCi. Append ("\"> ");
StrCi. Append ("select ");
StrCi. Append ("</option> ");
}
Else
{
List <CasMenuModels. City> list = new CasMenuBLL. CityManager (). GetAllByProId (Convert. ToInt32 (str); // obtain the City set based on the province ID
Foreach (City c in list)
{
StrCi. Append ("<option value = \"");
StrCi. Append (c. CityId );
StrCi. Append ("\"> ");
StrCi. Append (c. CityName );
StrCi. Append ("</option> ");
}
}
Return strCity = strCi. ToString ();
}
# Endregion
}
Note that I have comments,
Of course, the frontend transfer to the background method is far more than this method. For example, AJAXPRO is also very useful.
Source code download
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
