实现二级联动

来源:互联网 发布:时间序列算法 编辑:程序博客网 时间:2024/04/30 12:12

方法1:

Index.aspx:

   <script language="JavaScript" type="text/javascript">
      var varpic;
   <!--
   //以XML求取数据
   //参数:
   //obj,当前动作的下拉框
   //fullName:要填充的下拉框
   function XmlPost(obj,fullName)
   {
    //求取当前下拉框的值
     var svalue = obj.value;
     //定义要填充的对象
     var fullObj = document.all(fullName);
     
     //定义取值地址
     var webFileUrl = "?provinceID=" + svalue;
     
     //定义返回值
     var result = "";
     
     //开始取值过程
     var xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");
     xmlHttp.open("POST", webFileUrl, false);
     xmlHttp.send("");
     result = xmlHttp.responseText;

     //如果有取到值,则根据格式进行拆分
     //注意如果选择了第一行"请选择"空行时,是取不到值的,因此多加了一个条件
     if(result != "" && svalue != "")
     {
      //先清空原有的值
       fullObj.length=0;
       
       //拆分值成数组
       var piArray = result.split(",");
       
       //循环数组
       for(var i=0;i<piArray.length;i++)
       {
        //再拆分成ID及名称
         var ary1 = piArray[i].toString().split("|");
         //逐一添加项
         fullObj.options.add(new Option(ary1[1].toString(),ary1[0].toString()));
       }
     }
     else
     {
       //如果没有取到值,则清空要填充的下拉框的值
       fullObj.length = 0;
       fullObj.options.add(new Option("请选择",""));
     }
   }
   //-->   

   </script>

Index.aspx.cs:

  protected string provinceID;
  private void Page_Load(object sender, System.EventArgs e)
  {
   
       //接收参数
       provinceID = this.Request.QueryString["provinceID"];
       //判断参数是否为空(注意:空有两种形式,一种为null,一种为空)
       if (provinceID + "a" != "a")
       {
         //如果有传递上述参数,则表示联动操作开始
         this.xmlBind(provinceID);
       }

       //在页面初次加载的时候,绑定第一/二个下拉框,第二个下拉框为所有值
      //但实际上,第二个下拉框应显示空值,因为所有值可能也不少,最好只显示一个"请选择"字样   
      if(!this.IsPostBack)
      {
         this.DownBind1();
         this.DownBind2();
      }
  }
  /// <summary>
  /// 返回第2个下拉框需要的值给xmlhttp
  /// </summary>
  /// <param name="sortid">传递的关键ID值</param>
  
  private void xmlBind(string provinceID)
  {
   string mystr = "";
   string sql = "select city,cityID from city where father = " + provinceID;
   DataTable mytab = ConnObject.Get_Dt(sql);

   //将取到的值形成: ID|名称,ID|名称...这样的形式
   if (mytab.Rows.Count != 0)
   {
    for (int i = 0; i < mytab.Rows.Count; i++)
    {
     mystr += "," + mytab.Rows[i]["cityID"].ToString() + "|" + mytab.Rows[i]["city"].ToString();
    }
    mystr = mystr.Substring(1);
   }

   //输出页面
   this.Response.Write(mystr);
   this.Response.End();
  }

  /// <summary>
  /// 绑定第一个下拉框
  /// </summary>
  private void DownBind1()
  {
   //显示所有的主分类
   string sql = "select provinceID,province from province order by provinceID asc ";
   DataTable mytab = ConnObject.Get_Dt(sql);

   //绑定第一个下拉框
   this.ddlPro.DataSource = mytab;
   this.ddlPro.DataValueField = "provinceID";
   this.ddlPro.DataTextField = "province";
   this.ddlPro.DataBind();

   //添加一个"请选择"行
   this.ddlPro.Items.Insert(0, new ListItem("请选择省份", ""));

   //为此下拉框添加一个默认选择项(此处默认为sortid = 1
   //做选项时,如果你添加的选定项而此控件中却没有此项,即会出错
   //如:this.mydown1.SelectedValue = "1";
   //所以此处以如下方式进行选定
   ListItem myItem = this.ddlPro.Items.FindByValue("1");
   if (myItem != null)
   {
    myItem.Selected = true;
   }

   //为此下拉框添加选择事件,第一个参数是自己,第二个参数为要填充的下拉框的名称
   this.ddlPro.Attributes.Add("onchange", "XmlPost(this,'" + this.ddlCity.ClientID + "');");
  }

  /// <summary>
  /// 绑定第二个下拉框
  /// </summary>
  private void DownBind2()
  {
   //默认显示分类号为1的所有子类
   string sql = "select father,city,cityID from city where father =1";
   
   DataTable mytab = ConnObject.Get_Dt(sql);
   //绑牢控件
   this.ddlCity.DataSource = mytab;
   this.ddlCity.DataSource = mytab;
   this.ddlCity.DataValueField = "cityID";
   this.ddlCity.DataTextField = "city";
   this.ddlCity.DataBind();

   //添加一个空的首行
   //this.ddlCity.Items.Insert(0, new ListItem("请选择名称", ""));
  }

 方法2:

Register.aspx

<SCRIPT language="javascript">   
   //城市------------------------------
   function cityResult()
   {
    var city=document.getElementById("ddl_nativeplacePro");
    AjaxMethod.GetCityList(city.value,get_city_Result_CallBack);
   }
   
   function get_city_Result_CallBack(response)
   {
    if (response.value != null)
    {     
     //debugger;
     document.all("ddl_nativeplaceCity").length=0;       
       var ds = response.value;
     if(ds != null && typeof(ds) == "object" && ds.Tables != null)
     {     
      for(var i=0; i<ds.Tables[0].Rows.length; i++)
        {
         var name=ds.Tables[0].Rows[i].city;
          var id=ds.Tables[0].Rows[i].cityID;
          document.all("ddl_nativeplaceCity").options.add(new Option(name,id));
        }
     }
    }    
    return
   }

Register.aspx.cs

private void Page_Load(object sender, System.EventArgs e)
  {
   // 在此处放置用户代码以初始化页面

   Ajax.Utility.RegisterTypeForAjax(typeof(AjaxMethod));
   if(!Page.IsPostBack)
   {
    this.workaddressBind();
   }
   
  }
public void workaddressBind()//工作所在地数据库联动
  {

   this.ddl_workaddresspro.DataSource=AjaxMethod.GetPovinceList();
   this.ddl_workaddresspro.DataTextField="province";
   this.ddl_workaddresspro.DataValueField="provinceID";
   this.ddl_workaddresspro.DataBind();
    
   this.ddl_workaddresspro.Attributes.Add("onclick","AddcityResult();");
   this.ddl_workaddresscity.Attributes.Add("onclick","AddareaResult();");
  }

AjaxMethod.cs

public class AjaxMethod
 {
  
  #region GetPovinceList
  public static DataSet GetPovinceList()
  {
   string sql="select * from province";
   return GetDataSet(sql);
  }
  #endregion

  #region GetCityList
  [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
  public  DataSet GetCityList(int povinceid)
  {
   string sql="select * from city where father="+povinceid;
   return GetDataSet(sql);  
   
  }
  #endregion

 #region GetDataSet
  public static DataSet GetDataSet(string sql)
  {
   string ConnectionString=System.Configuration.ConfigurationSettings.AppSettings["cont"];
   SqlDataAdapter sda =new SqlDataAdapter(sql,ConnectionString);
   DataSet ds=new DataSet();
   sda.Fill(ds);
   return ds;
  }
  #endregion

}

Web.config:

 <system.web>

………………

<httpHandlers>
   <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
 </httpHandlers>

 </system.web>

原创粉丝点击