数据库内容如上图;
Default.aspx页前台代码:
<%@ Page Language="C#" EnableEventValidation="false" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function load(state)
{
var dp2=document.getElementById("DropDownList2");
while(dp2.options.length>0)
{
dp2.options.remove(0);
}
var oHttpReq = new ActiveXObject("MSXML2.XMLHTTP");
var oDoc = new ActiveXObject("MSXML2.DOMDocument");
oHttpReq.open("POST", "Default2.aspx?state="+state, false);
oHttpReq.send("");
result = oHttpReq.responseText;
oDoc.loadXML(result);
items = oDoc.selectNodes("//NewDataSet/china"); //NewDataSet代表数据集名,china代表数据集中的表名
for (var item = items.nextNode(); item; item = items.nextNode())
{
var city = item.selectSingleNode("cityname").nodeTypedValue; //cityname数据库表字段名
var cid=item.selectSingleNode("id").nodeTypedValue; //id数据库ID
var newOption = document.createElement("OPTION");
newOption.text = city; //下拉框的文本,如北京
newOption.value = cid; //下拉框的值,如11
dp2.options.add(newOption);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList>
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
<asp:Label ID="Label1" runat="server"></asp:Label><br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="添 加" /></div>
</form>
</body>
</html>
Default.aspx后台代码:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{
SqlConnection conn;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Binddata();
}
}
protected void Binddata()
{
conn = SqlHelper.conn();
string sql = "select * from china where parentid=0";
SqlCommand cmd = new SqlCommand(sql,conn);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
conn.Open();
da.Fill(ds, "table");
conn.Close();
this.DropDownList1.DataSource = ds;
this.DropDownList1.DataTextField = "cityname";
this.DropDownList1.DataValueField = "id";
this.DropDownList1.DataBind();
this.DropDownList1.Attributes.Add("onchange", "load(this.options[this.selectedIndex].value)");//如果传中文建议用value,要传Dropdownlist取的文本innerText；
}
protected void Button1_Click(object sender, EventArgs e)
{
//测试第二个DropDownList的值
this.Label1.Text = this.Request.Form["DropDownList2"].ToString();
}
}
Default2.aspx的前台代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
Default2.aspx的后台CS代码:
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using System.Xml;
public partial class Default2 : System.Web.UI.Page
{
SqlConnection conn;
protected void Page_Load(object sender, EventArgs e)
{
Binddata();
}
protected void Binddata()
{
if (this.Request["state"] != null)
{
string state = this.Request["state"].ToString();
conn = SqlHelper.conn();
SqlDataAdapter da = new SqlDataAdapter("select * from china where parentid = '" + state + "'", conn);
DataSet ds = new DataSet(); //此处CITY表示数据集名,与上面取数据时一致
da.Fill(ds,"china");
XmlTextWriter writer = new XmlTextWriter(Response.OutputStream, Response.ContentEncoding);
writer.Formatting = Formatting.Indented;
writer.Indentation = 4;
writer.IndentChar = ' ';
ds.WriteXml(writer);
writer.Flush();
Response.End();
writer.Close();
}
else
{
Response.Write("<script>alert('错误了哦')</script>");
}
}
}
SQLHELPER返回数据库连接:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
/// <summary>
/// SqlHelper 的摘要说明
/// </summary>
public class SqlHelper
{
public SqlHelper()
{
//
// TODO: 在此处添加构造函数逻辑
//
}
public static SqlConnection conn()
{
string conn=System.Configuration.ConfigurationManager.AppSettings["conn"];
SqlConnection myconn = new SqlConnection(conn);
return myconn;
}
}
WEBCONFIG
<?xml version="1.0"?>
<!--
注意: 除了手动编辑此文件以外，您还可以使用
Web 管理工具来配置应用程序的设置。可以使用 Visual Studio 中的
“网站”->“Asp.Net 配置”选项。
设置和注释的完整列表在
machine.config.comments 中，该文件通常位于
\Windows\Microsoft.Net\Framework\v2.x\Config 中
-->
<configuration>
<appSettings>
<!--实例化类型-->
<!--数据库连接字符串-->
<add key="conn" value="Server=.;DataBase=droptest;uid=sa;password=123;"/>
</appSettings>
<connectionStrings/>
<system.web>
<!--
设置 compilation debug="true" 将调试符号插入
已编译的页面中。但由于这会
影响性能，因此只在开发过程中将此值
设置为 true。
-->
<compilation debug="true">
<assemblies>
<add assembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/></assemblies></compilation>
<!--
通过 <authentication> 节可以配置 ASP.NET 使用的
安全身份验证模式，
以标识传入的用户。
-->
<!--
如果在执行请求的过程中出现未处理的错误，
则通过 <customErrors> 节可以配置相应的处理步骤。具体说来，
开发人员通过该节可以配置
要显示的 html 错误页
以代替错误堆栈跟踪。
<customErrors mode="RemoteOnly" defaultRedirect="GenericErrorPage.htm">
<error statusCode="403" redirect="NoAccess.htm" />
<error statusCode="404" redirect="FileNotFound.htm" />
</customErrors>
-->
</system.web>
</configuration>
效果如下:
