------------------------------------- Webservice1.asmx ---------------------------------------
// To allow ASP. Net ajax to call this web service from a script, cancel the comments to the downstream.
[System. Web. Script. Services. scriptservice]
Public class webservice1: system. Web. Services. WebService
{
[Webmethod]
Public String helloworld ()
{
Return "Hello World ";
}
[Webmethod]
Public list <model. province> getprovince ()
{
Bll. Province bpro = new BLL. Province ();
List <model. province> List = bpro. getlistmodel ();
Return list;
}
[Webmethod]
Public list <model. City> getcitybypro (string proid)
{
Bll. City bcity = new BLL. City ();
List <model. City> List = bcity. getlistmodel ("Father = '" + proid + "'");
Return list;
}
[Webmethod]
Public list <model. Area> getareabycity (string cityid)
{
Bll. Area Barea = new BLL. Area ();
List <model. Area> List = Barea. getlistmodel ("Father = '" + cityid + "'");
Return list;
}
----------------------------------Htmlpage1.htm ----------------------------
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> </title>
<Style type = "text/CSS">
Select
{
Width: 150px;
}
</Style>
<SCRIPT src = "JS/jquery1.7.js" type = "text/JavaScript"> </SCRIPT>
<SCRIPT type = "text/JavaScript">
$ (Function (){
$. Ajax ({
Type: "Post ",
Contenttype: "application/JSON ",
URL: "webservice1.asmx/getprovince ",
Data :"{}",
Success: function (result ){
VaR stroption = '';
For (VAR I = 0; I <result. D. length; I ++ ){
Stroption + = '<option value =' + result. d [I]. provinceid + '> ';
Stroption + = result. d [I]. provincename;
Stroption + = '</option> ';
}
$ ('# Seprovince'). append (stroption );
}
})
$ ('# Seprovince'). Change (function (){
$ ('# Secity option: GT (0)'). Remove ();
$ ('# Searea option: GT (0)'). Remove ();
$. Ajax ({
Type: "Post ",
Contenttype: "application/JSON ",
URL: "webservice1.asmx/getcitybypro ",
Data: "{proid: '" + $ (this). Val () + "'}",
Success: function (result ){
VaR strocity = '';
For (VAR I = 0; I <result. D. length; I ++ ){
Strocity + = '<option value =' + result. d [I]. cityid + '> ';
Strocity + = result. d [I]. cityname;
Strocity + = '</option> ';
}
$ ('# Secity'). append (strocity );
}
})
})
$ ('# Secity'). Change (function (){
$ ('# Searea option: GT (0)'). Remove ();
$. Ajax ({
Type: "Post ",
Contenttype: "application/JSON ",
URL: "webservice1.asmx/getareabycity ",
Data: "{cityid: '" + $ (this). Val () + "'}",
Success: function (result ){
VaR stroarea = '';
For (VAR I = 0; I <result. D. length; I ++ ){
Stroarea + = '<option value =' + result. d [I]. areaid + '> ';
Stroarea + = result. d [I]. areaname;
Stroarea + = '</option> ';
}
$ ('# Seare'). append (stroarea );
}
})
})
})
</SCRIPT>
</Head>
<Body>
<Table>
<Tr>
<TD>
Address
</TD>
<TD>
<Select id = "seprovince">
<Option> -- select -- </option>
</SELECT>
Save
<Select id = "secity">
<Option> -- select -- </option>
</SELECT> City
<Select id = "searea">
<Option> -- select -- </option>
</SELECT> County
</TD>
</Tr>
</Table>
</Body>
</Html>
Note: using the three-tier architecture, the Dal layer writes some methods