XmlHttp实现无刷新三联动下拉框

1.html代码

<HTML>

<HEAD>

<title>XmlHttp实现无刷新三联动下拉框</title>

</HEAD>

<INPUT style="Z-INDEX: 102; LEFT: 448px; WIDTH: 56px; POSITION: absolute; TOP: 8px; HEIGHT: 24px"

onclick="getData();" type="button" value="test">

<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 16px; POSITION: absolute; TOP: 8px" runat="server"

Width="424px"></asp:TextBox>

<asp:DropDownList id="DropDownList2" runat="server" style="Z-INDEX: 103; LEFT: 176px; POSITION: absolute; TOP: 48px"></asp:DropDownList>

<asp:DropDownList id="DropDownList1" runat="server" style="Z-INDEX: 104; LEFT: 16px; POSITION: absolute; TOP: 48px"></asp:DropDownList>

<asp:DropDownList id="DropDownList3" runat="server" style="Z-INDEX: 105; LEFT: 296px; POSITION: absolute; TOP: 48px"></asp:DropDownList>

<!--

//以XML求取DropDownList2的数据

function XmlPost2(obj)

{

　　 var svalue = obj.value;

　　 var webFileUrl = "?provinceid=" + svalue;

　　 var result = "";

　　 var xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");

　　 xmlHttp.open("POST", webFileUrl, false);

　　 xmlHttp.send("");

　　 result = xmlHttp.responseText;

　　 if(result != "")

　　 {

　　　　 document.all("DropDownList2").length=0;

　　　　 var piArray = result.split(",");

　　　　 for(var i=0;i<piArray.length;i++)

　　　　 {

　　　　　　 var ary1 = piArray[i].toString().split("|");

　　　　　　 document.all("DropDownList2").options.add(new Option(ary1[1].toString(),ary1[0].toString()));

　　　　 }

　　 else

　　 {

　　　　 alert(result);

　　 }

//以XML求取DropDownList3的数据

function XmlPost3(obj)

{

　　 var svalue = obj.value;

　　 var webFileUrl = "?cityid=" + svalue;

　　 var result = "";

　　 var xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");

　　 xmlHttp.open("POST", webFileUrl, false);

　　 xmlHttp.send("");

　　 result = xmlHttp.responseText;

　　 if(result != "")

　　 {

　　　　 document.all("DropDownList3").length=0;

　　　　 var piArray = result.split(",");

　　　　 for(var i=0;i<piArray.length;i++)

　　　　 {

　　　　　　 var ary1 = piArray[i].toString().split("|");

　　　　　　 document.all("DropDownList3").options.add(new Option(ary1[1].toString(),ary1[0].toString()));

　　　　 }

　　 else

　　 {

　　　　 alert(result);

　　 }

function getData()

{

var province=document.getElementById("DropDownList1");

var pindex = province.selectedIndex;

var pValue = province.options[pindex].value;

var pText = province.options[pindex].text;

var city=document.getElementById("DropDownList2");

var cindex = city.selectedIndex;

var cValue = city.options[cindex].value;

var cText = city.options[cindex].text;

var area=document.getElementById("DropDownList3");

var aindex = area.selectedIndex;

var aValue = area.options[aindex].value;

var aText = area.options[aindex].text;

var txt=document.getElementById("TextBox1");

document.getElementById("<%=TextBox1.ClientID%>").innerText="省:"+pValue+"|"+pText+"市:"+cValue+"|"+cText+"区:"+aValue+"|"+aText;

}

//-->

</SCRIPT>

</form>

</body>

</HTML>

2.cs代码

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.Data.SqlClient;

namespace WebApplication1

{

/// <summary>

/// Summary description for WebForm1.

/// </summary>

public class WebForm1 : System.Web.UI.Page

{

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

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

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

protected System.Web.UI.WebControls.TextBox TextBox1;

public static string ConnectionString=System.Configuration .ConfigurationSettings .AppSettings["ConnectionString"];

GetDataSet

property#region property

private string provinceid

{

get

{

if(ViewState["provinceid"]!=null && ViewState["provinceid"].ToString()!="")

{

return ViewState["provinceid"].ToString();

}

else

{

if(Request["provinceid"]!=null && Request["provinceid"].ToString()!="")

{

return Request["provinceid"];

}

else

{

return "";

}

set

{

ViewState["provinceid"]=value;

}

private string cityid

{

get

{

if(ViewState["cityid"]!=null && ViewState["cityid"].ToString()!="")

{

return ViewState["cityid"].ToString();

}

else

{

if(Request["cityid"]!=null && Request["cityid"].ToString()!="")

{

return Request["cityid"];

}

else

{

return "";

}

set

{

ViewState["provinceid"]=value;

}

#endregion

Page_Load

down2_bind

down3_bind

down1_bind

Web Form Designer generated code

}

3.数据库area1.rar
4.Ajax实现无刷新三联动下拉框

5.源代码下载XmlHttpselect.rar

6.Asp.Net 2.0 中回发或回调参数无效的解决方案
回发或回调参数无效。在配置中使用 <pages enableEventValidation="true"/> 或在页面中使用 <%@ Page EnableEventValidation="true" %> 启用了事件验证。出于安全目的，此功能验证回发或回调事件的参数是否来源于最初呈现这些事件的服务器控件。

目前为止遇到的出现情况有两种：
一是Form嵌套，一个页面只能有一个Form，仔细检查代码就可以解决。
二是在下拉菜单中使用javascript 来更改内容(如AJAX)，常见于省市联动菜单，在事件回发时提示该错误。

该错误只有在 vs 2.0 上才会出现，如果把 enableEventValidation="true" 改成 enableEventValidation="false" 错误是不会出事了但是在代码中确读不到此项的值。

第一种情况的话不能在form 里嵌form

第二种情况的解决办法就是把控制改成 Html 的控制，控件带上 runat="server"

如：下面是我的一个解决办法

一个省份和城市的链动效果

省

<asp:DropDownList ID="DropDownList3" runat="server" onchange="changelocation(DropDownList3.options[DropDownList3.selectedIndex].value)">
</asp:DropDownList>

市

然后在后台 cs代码里用 Request.Form["DDLcity"]; 来接收城市的值。

posted on 2007-05-26 09:29 秦岭过客阅读(302) 评论(0) 编辑收藏举报