您的位置：首页 > 其它

一个同学写的Ajax三级联动的DEMO

2008-03-05 17:32 204 查看
效果如下：



后台代码：

using System;

using System.Collections;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Web;

using System.Web.SessionState;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.HtmlControls;

using System.IO;

using System.Text;

namespace AjaxDropDownList.WebUI

{

/// <summary>

///

/// </summary>

public class _Default : System.Web.UI.Page

{

protected System.Web.UI.WebControls.DropDownList ddlDistrict;

public static string DistrictSTR;

public static string StateSTR;

public static string CitySTR;

private void Page_Load(object sender, System.EventArgs e)

{

// 在此处放置用户代码以初始化页面

Ajax.Utility.RegisterTypeForAjax(typeof(_Default));

if(!this.IsPostBack)

{

DistrictSTR=Server.MapPath("Addr_District.xml");

StateSTR=Server.MapPath("Addr_State.xml");

CitySTR=Server.MapPath("Addr_City.xml");

initDistrict();

}

}

//地区

public void initDistrict()

{

DataSet ds=new DataSet();

ds.ReadXml(DistrictSTR);

this.ddlDistrict.DataSource=ds;

this.ddlDistrict.DataTextField="DistrictName";

this.ddlDistrict.DataValueField="DistrictCode";

this.ddlDistrict.DataBind();

this.ddlDistrict.Attributes.Add("onchange","StateResult()");

}

//省份

[Ajax.AjaxMethod()]

public string getState(string districtCode)

{

DropDownList ddlState=new DropDownList();

DataSet ds=new DataSet();

ds.ReadXml(StateSTR);

ddlState.DataSource=ds.Tables[0].DefaultView;

ds.Tables[0].DefaultView.RowFilter="StateCode like '"+districtCode+"%'";

ddlState.DataTextField="StateName";

ddlState.DataValueField="StateCode";

ddlState.DataBind();

ddlState.Width=120;

ddlState.Attributes.Add("onchange","CityResult()");

StringBuilder strb=new StringBuilder();

StringWriter sw=new StringWriter(strb);

HtmlTextWriter htw=new HtmlTextWriter(sw);

ddlState.RenderControl(htw);

return strb.ToString();

}

//城市

[Ajax.AjaxMethod()]

public string getCity(string stateCode)

{

DropDownList ddlCity=new DropDownList();

DataSet ds=new DataSet();

ds.ReadXml(CitySTR);

ddlCity.DataSource=ds.Tables[0].DefaultView;

ds.Tables[0].DefaultView.RowFilter="CityCode like'"+stateCode+"%'";

ddlCity.DataTextField="CityName";

ddlCity.DataValueField="CityCode";

ddlCity.DataBind();

ddlCity.Width=120;

StringBuilder strb=new StringBuilder();

StringWriter sw=new StringWriter(strb);

HtmlTextWriter htw=new HtmlTextWriter(sw);

ddlCity.RenderControl(htw);

return strb.ToString();

}

//DataGrid

[Ajax.AjaxMethod()]

public string getDataGrid(string stateCode)

{

DataGrid dg=new DataGrid();

DataSet ds=new DataSet();

ds.ReadXml(CitySTR);

dg.DataSource=ds.Tables[0].DefaultView;

ds.Tables[0].DefaultView.RowFilter="CityCode like '"+stateCode+"%'";

dg.DataBind();

dg.HeaderStyle.ForeColor=System.Drawing.Color.White;

dg.HeaderStyle.Font.Bold=true;

dg.HeaderStyle.BackColor=System.Drawing.Color.FromName("yellow");//highlight

dg.HeaderStyle.Height=20;

dg.CellPadding=3;

StringBuilder strb=new StringBuilder();

StringWriter sw=new StringWriter(strb);

HtmlTextWriter htw=new HtmlTextWriter(sw);

dg.RenderControl(htw);

return strb.ToString();

}

#region Web 窗体设计器生成的代码

override protected void OnInit(EventArgs e)

{

//

// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。

//

InitializeComponent();

base.OnInit(e);

}

/// <summary>

/// 设计器支持所需的方法 - 不要使用代码编辑器修改

/// 此方法的内容。

/// </summary>

private void InitializeComponent()

{

this.Load += new System.EventHandler(this.Page_Load);

}

#endregion

}

}

前台代码：

<%@ Page language="c#" Codebehind="Default.aspx.cs" AutoEventWireup="false" Inherits="AjaxDropDownList.WebUI._Default" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

<HEAD>

<title>Default</title>

<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">

<meta content="C#" name="CODE_LANGUAGE">

<meta content="JavaScript" name="vs_defaultClientScript">

<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">

<script language="javascript">

<!--

function StateResult()

{

var districtCode=document.getElementById("ddlDistrict").value;

var State=document.getElementById("stateTD");

State.innerHTML=_Default.getState(districtCode).value;

CityResult();

}

function CityResult()

{

var obj=document.getElementById("stateTD");

var stateCode=obj.getElementsByTagName("select")[0].value;

var City=document.getElementById("cityTD");

City.innerHTML=_Default.getCity(stateCode).value;

var dataGrid=document.getElementById("ucTD");

dataGrid.innerHTML=_Default.getDataGrid(stateCode).value;

}

-->

</script>

<style type="text/css">

TD { FONT-SIZE: 13px }

</style>

</HEAD>

<body onload="StateResult()">

<form id="Form1" method="post" runat="server">

<TABLE id="Table1" cellSpacing="0" cellPadding="2" width="500" border="0">

<TR>

<TD style="WIDTH: 120px; HEIGHT: 20px">

<P align="right">地区</P>

</TD>

<TD style="HEIGHT: 20px">

<asp:dropdownlist id="ddlDistrict" runat="server" Width="120px"></asp:dropdownlist></TD>

</TR>

<TR>

<TD style="WIDTH: 120px; HEIGHT: 25px">

<P align="right">省份</P>

</TD>

<TD id="stateTD" style="HEIGHT: 25px"><FONT face="宋体"></FONT></TD>

</TR>

<TR>

<TD style="WIDTH: 120px; HEIGHT: 26px">

<P align="right">城市</P>

</TD>

<TD id="cityTD" style="HEIGHT: 26px"><FONT face="宋体"></FONT></TD>

</TR>

<TR>

<TD style="WIDTH: 120px"></TD>

<TD id="ucTD"><FONT face="宋体"></FONT></TD>

</TR>

</TABLE>

</form>

</body>

</HTML>

这里是读取XML数据的，想自己试一下的朋友，请这里下载XML 放到同级文件夹里即可！
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航