JavaScript实现DropDownList(Select)三级联动无刷新

来源:互联网 发布:excel查找多个数据 编辑:程序博客网 时间:2024/05/25 01:35

Javascript代码

<script language=javascript>         
          function CountryChange(){
          countryid=document.getElementById("ddlContry").value;
          if(countryid==null||countryid==""){
          alert("请选择所属国家");
          CountryDel("ddlProvince");//清空DropDownList
          CountryDel("ddlCity");//清空DropDownList
          return false;
          }
          var countrystring="";
          var posturl=location.protocol+"//"+location.hostname+"//soleweb//AjaxEnjine//AreaShow.aspx?AreaId="+countryid;
          countrystring=openUrl(posturl);
          if(countrystring=="-2"){//查询失败
          alert("数据查询失败");
          return false;
          }
          //分割并写入DropDownList
         
          CountryDel("ddlProvince");//清空DropDownList
          CountryDel("ddlCity");//清空DropDownList      
          if(countrystring==""){
          return false;
          }
        
          var stringarray=countrystring.split("|");
          for(var i=0;i<stringarray.length;i++){//重写DropDownList
          //拆分内部数组
          var optionarray=stringarray[i].split(",");
          var newoption=document.createElement("option");
          newoption.text=optionarray[0];
          newoption.value=optionarray[1];
          document.getElementById("ddlProvince").options.add(newoption);  
          }
          }
         
          function CountryDel(AreaName){//清空DropDownList
          var countnum=document.getElementById(AreaName).options.length;
          for(var i=1;i<countnum;i++){//清空DropDownList
          document.getElementById(AreaName).remove(countnum-i);
          }
          }
         
          function ProvinceChange(){
          countryid=document.getElementById("ddlProvince").value;
          if(countryid==null||countryid==""){
          alert("请选择所属省");
          CountryDel("ddlCity");//清空DropDownList
          return false;
          }
          var countrystring="";
          var posturl=location.protocol+"//"+location.hostname+"//soleweb//AjaxEnjine//AreaShow.aspx?AreaId="+countryid;
          countrystring=openUrl(posturl);
          if(countrystring=="-2"){//查询失败
          alert("数据查询失败");
          return false;
          }
          //分割并写入DropDownList
         
          CountryDel("ddlCity");//清空DropDownList
          if(countrystring==""){
          return false;
          }
        
          var stringarray=countrystring.split("|");
          for(var i=0;i<stringarray.length;i++){//重写DropDownList
          //拆分内部数组
          var optionarray=stringarray[i].split(",");
          var newoption=document.createElement("option");
          newoption.text=optionarray[0];
          newoption.value=optionarray[1];
          document.getElementById("ddlCity").options.add(newoption);  
          }
          }    
         
          function openUrl(url)
          {  
                  var objxml=new ActiveXObject("Microsoft.XMLHttp")
                  objxml.open("GET",url,false);
                  objxml.send();
                  retInfo=objxml.responseText;
                  if (objxml.status=="200")
                  {
                      return retInfo;
                  }
                  else
                   {
                      return "-2";
                  }
          }
</script>

Html代码

<asp:DropDownList ID="ddlContry" runat="server" onchange="CountryChange()" OnSelectedIndexChanged="ddlContry_SelectedIndexChanged">
                    <asp:ListItem Value=" ">请选择所属国家</asp:ListItem>
                </asp:DropDownList>
                <asp:DropDownList ID="ddlProvince" runat="server" onchange="ProvinceChange()" OnSelectedIndexChanged="ddlProvince_SelectedIndexChanged">
                    <asp:ListItem Value=" ">请选择所属省</asp:ListItem>
                </asp:DropDownList>
                <asp:DropDownList ID="ddlCity" runat="server">
                    <asp:ListItem Value=" ">请选择所属市</asp:ListItem>
                </asp:DropDownList>

 Aspx.cs代码

protected void Page_Load(object sender, EventArgs e)
    {
        SoLe.Common.StringFormat sft = new SoLe.Common.StringFormat();
        string AreaId = sft.Html_Fn(Request.QueryString["AreaId"].ToString());
        StringBuilder AreaString = new StringBuilder();
        AreaString.Append("");
        if (!Page.IsPostBack)
        {
            //Response.Write(AreaIdValid(AreaId.ToString()));
            SoLe.BLL.AreaTable bll = new SoLe.BLL.AreaTable();
            DataSet ds = new DataSet();
            ds = bll.GetList(" PaterId=" + AreaId.ToString()+" ");           
            if (!object.Equals(ds, null) && ds.Tables[0].Rows.Count > 0) {
                for (int i = 0; i < ds.Tables[0].Rows.Count; i++) {
                    if (string.IsNullOrEmpty(AreaString.ToString()))
                    {
                        AreaString.Append(ds.Tables[0].Rows[i]["Title"].ToString() + "," + ds.Tables[0].Rows[i]["Id"].ToString());
                    }
                    else {
                        AreaString.Append("|" + ds.Tables[0].Rows[i]["Title"].ToString() + "," + ds.Tables[0].Rows[i]["Id"].ToString());
                    }
                }
            }           
        }
        Response.Write(AreaString.ToString());
    }

原创粉丝点击