<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!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 runat="server">
<title></title>
<script src="jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#ProvinceList").bind("keyup change", function (e) {
e.preventDefault(); // 首先初始化
$("#CityList").empty().append($("<option></option>").val("0").html(" --- 請選擇 --- "));
if ($(this).val() != "0") {
sendData($(this).val());
}
});
$("#CityList").bind("keyup change", function (e) {
e.preventDefault(); // 首先初始化
$("#Dist").empty().append($("<option></option>").val("0").html(" --- 請選擇 --- "));
if ($(this).val() != "0") {
sendData2($(this).val());
}
});
function sendData(sBuyID) {
$.ajax({
type: "POST",
url: "Default3.aspx/GetSubList", // 調動後臺頁面方法
data: '{"sBuyID":"' + sBuyID + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
// msg.d是數組，由後臺數組ArrayList返回，因此可以遍歷每個元素
$.each(msg.d, function () {
// this.Value和this.Text是後臺返回數組ArrayList類型包含元素ListItem類型的屬性
$("#CityList").append($("<option></option").val(this.Value).html(this.Text));
});
},
error: function () {
alert("ajax請求發生錯誤");
}
});
}
function sendData2(sdrID) {
$.ajax({
type: "POST",
url: "Default3.aspx/GetdrList", // 調動後臺頁面方法
data: '{"sdrID":"' + sdrID + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
// msg.d是數組，由後臺數組ArrayList返回，因此可以遍歷每個元素
$.each(msg.d, function () {
// this.Value和this.Text是後臺返回數組ArrayList類型包含元素ListItem類型的屬性
$("#Dist").append($("<option></option").val(this.Value).html(this.Text));
});
},
error: function () {
alert("ajax請求發生錯誤");
}
});
}
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div align="center">
<fieldset style="width: 480px; height: 150px;">
<table border="0" cellpadding="10" cellspacing="10">
<tr>
<td>
<asp:DropDownList ID="ProvinceList" runat="server" Width="120px">
<asp:ListItem Value="0" Text=" --- 請選擇省份 --- "></asp:ListItem>
<asp:ListItem Value="1" Text="河北"></asp:ListItem>
<%-- <asp:ListItem Value="2" Text="江蘇"></asp:ListItem> --%>
</asp:DropDownList>
</td>
<td>
<asp:DropDownList ID="CityList" runat="server" Width="120px">
<asp:ListItem Value="0" Text=" --- 請選擇城市 --- "></asp:ListItem>
</asp:DropDownList>
</td>
<td>
<asp:DropDownList ID="Dist" runat="server" Width="120px">
<asp:ListItem Value="0" Text=" --- 請選擇鄉鎮 --- "></asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</fieldset>
</div>
</form>
</body>
</html>