用AjaxPro来完成二级连动

现在在实现二级连动或是三级连动方面,都是采用ajax来完成的。网上的例子也很多。 我采用的是AjaxPro来完的。 如何配置AjaxPro我就不说了。直接说下程序。 数据库表二个 主表C_BigClass   从表C_SmallClass C_BigClass字段                                                    C_SmallClass字段 id                                                                                  id BigClass                                                                    SmallClass                                                                                      BigClassid 前台页面 ddlTwo.aspx
<script type="text/javascript">

       function ShowCity(id)

       {

          var result = chen.getCityList(id).value;

          var ddlcity = document.getElementById("ddlCity");

          ddlcity.length=0;

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

          {

             ddlcity.options.add(new Option(result.Rows[i].SmallClass,result.Rows[i].id));

          }

       }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <p>

        省份:<asp:DropDownList ID="ddlPro" runat="server">

        </asp:DropDownList>

   市区:<asp:DropDownList ID="ddlCity" runat="server">

        </asp:DropDownList>

    </p>

    <div>

    

    </div>

    </form>

</body>
后台:ddlTwo.aspx.cs
[AjaxPro.AjaxNamespace("chen")]

    public partial class ddlTwo : System.Web.UI.Page

    {



        protected void Page_Load(object sender, EventArgs e)

        {

            AjaxPro.Utility.RegisterTypeForAjax(typeof(ddlTwo));



            SqlConnection conn = new SqlConnection("server=.;uid=sa;pwd=chen123;database=C_News;");

            conn.Open();

            SqlCommand cmd = new SqlCommand("", conn);

            string strsql = "select * from C_BigClass";

            cmd.CommandText = strsql;

            SqlDataAdapter da = new SqlDataAdapter();

            da.SelectCommand = cmd;

            DataTable dt = new DataTable();

            da.Fill(dt);



            this.ddlPro.DataSource = dt;

            this.ddlPro.DataValueField = "id";

            this.ddlPro.DataTextField = "BigClass";

            this.ddlPro.DataBind();



            this.ddlPro.Attributes["onchange"] = "ShowCity(this.options[selectedIndex].value)";



            conn.Close();

        }



        [AjaxPro.AjaxMethod]

        public DataTable getCityList(int id)

        {

            Hashtable ht = new Hashtable();



            SqlConnection conn = new SqlConnection("server=.;uid=sa;pwd=chen123;database=C_News;");

            conn.Open();

            SqlCommand cmd = new SqlCommand("", conn);

            string strsql = "select * from C_SmallClass where BigClassid="+id+"";

            cmd.CommandText = strsql;

            SqlDataAdapter da = new SqlDataAdapter();

            da.SelectCommand = cmd;

            DataTable dt = new DataTable();

            da.Fill(dt);



            return dt;

        }

    }



如果我们要进行三级或四级连动,其实很简单,只要在Page_load下面
this.ddlPro.Attributes["onchange"] = "ShowCity(this.options[selectedIndex].value)";的下面为每个下拉框
都加一个方法就行了。只不过多写几个public DataTable getCityList(int id)的程序。

你可能感兴趣的:(server,function,String,cmd,database,asp)