小山

付出最大努力,追求最高成就,享受最佳生活,收获无悔人生

博客园 首页 新随笔 联系 订阅 管理


1.html代码

<HTML>
    
<HEAD>
        
<title>XmlHttp实现无刷新三联动下拉框</title>
        
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
        
<meta name="CODE_LANGUAGE" Content="C#">
        
<meta name="vs_defaultClientScript" content="JavaScript">
        
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
    
</HEAD>
    
<body MS_POSITIONING="GridLayout">
        
<form id="Form1" method="post" runat="server">
            
<INPUT style="Z-INDEX: 102; LEFT: 448px; WIDTH: 56px; POSITION: absolute; TOP: 80px; HEIGHT: 24px"
                onclick
="getData();" type="button" value="保存" id="Button1" name="Button1" runat="server">
            
<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 16px; POSITION: absolute; TOP: 80px" runat="server"
                Width
="424px"></asp:TextBox>
            
<asp:DropDownList id="DropDownList2" runat="server" style="Z-INDEX: 103; LEFT: 176px; POSITION: absolute; TOP: 120px"></asp:DropDownList>
            
<asp:DropDownList id="DropDownList1" runat="server" style="Z-INDEX: 104; LEFT: 16px; POSITION: absolute; TOP: 120px"></asp:DropDownList>
            
<asp:DropDownList id="DropDownList3" runat="server" style="Z-INDEX: 105; LEFT: 296px; POSITION: absolute; TOP: 120px"></asp:DropDownList><INPUT style="Z-INDEX: 106; LEFT: 8px; WIDTH: 160px; POSITION: absolute; TOP: 176px; HEIGHT: 22px"
                type
="hidden" size="21" id="hidprovince" runat="server"><INPUT style="Z-INDEX: 107; LEFT: 184px; POSITION: absolute; TOP: 176px" type="hidden"
                id
="hidcity" runat="server"><INPUT style="Z-INDEX: 108; LEFT: 360px; POSITION: absolute; TOP: 176px" type="hidden"
                id
="hidarea" runat="server">
            
<SCRIPT LANGUAGE="JavaScript">
            
<!--
                
//以XML求取DropDownList2的数据
                function XmlPost2(obj)
                
{
                  
var svalue = obj.value;
                  
var webFileUrl = "?povinceid=" + 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;
                    document.Form1.hidprovince.value
=pValue;
                    document.Form1.hidcity.value
=cValue;
                    document.Form1.hidarea.value
=aValue;
                }

            
//-->
            
</SCRIPT>
        
</form>
    
</body>
</HTML>

2.cs代码

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

        
Page_Load

        
down2_bind

        
down3_bind
        
        
down1_bind

        
Web Form Designer generated code
    }

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

5.源代码下载XmlHttpselect.rar

posted on 2005-10-31 17:56  小山  阅读(25732)  评论(60编辑  收藏  举报