------------------------------------- WebService1.asmx ---------------------------------------
Copy codeThe Code is as follows:
// 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 ----------------------------
Copy codeThe Code is as follows:
<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