Ajax数据库两级联动菜单(SQLServer版)（转载）

Ajax数据库两级联动菜单(SQLServer版)

本文转载自：http://www.mychanglai.com/TopicCenter/DetailShow.aspx/6.html

第一步：首先建立一个js文件，在LianDong.aspx文件里调用

// JScript 文件

var xmlHttp;

var BigCate;

function createXMLHttpRequest()

{

    if (window.ActiveXObject)

    {

        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

    }

    else if (window.XMLHttpRequest)

    {

        xmlHttp = new XMLHttpRequest();

    }

}

 

function getBigCate()

{

    createXMLHttpRequest();

   

    BigCate = document.getElementById("BigCate").value;   

    xmlHttp.onreadystatechange=handleStateChange;

    xmlHttp.open("GET","Liandong.aspx?BigCateID="+BigCate+"",true);

    xmlHttp.send(null);  

}

 

function handleStateChange()

{

    if(xmlHttp.readyState == 4)

    {

        if(xmlHttp.status == 200)

        {

             getSmallCate(xmlHttp.responseText);            

        }

    }

}

 

function getSmallCate(paramValue)

{ 

    document.getElementById("SmallCate").length = 0;

    document.getElementById("SmallCate").options.add(new Option("please choose  the city","0")); 

            

    if (paramValue != "")

    {                                

       var Array1 = paramValue.split("|");        

 

        for(var i = 1;i < Array1.length;i++)

        {

        var Array2 = Array1[i].split(",");           

        document.getElementById("SmallCate").options.add(new Option(Array2[0].toString(),Array2[1].toString()));            

        }

    }

    else

    {

    document.getElementById("SmallCate").length = 0;

    }

}

 

 

 

第二步：在LianDong.aspx文件里调用上面的js文件，并添加两个DropDownList控件

<asp:DropDownList id="BigCate" runat="server"  Width="150px" ></asp:DropDownList>

<asp:DropDownList id="SmallCate" runat="server"  Width="150px"></asp:DropDownList>

<HtmlInputHidden id="myHidden" runat="server" />

 

 

第三步：在LianDong.aspx.cs文件里添加如下代码

    protected void Page_Load(object sender, EventArgs e)

    {

        BigCate.Attributes.Add("onchange", "getBigCate()");

        if (!Page.IsPostBack)

        {

            getBigCateValue();

            getSmailCateValue();

        }

    }

 

    private void getBigCateValue()

    {

        SqlDataReader dr;           

 

        SqlConnection myconn  = new SqlConnection(connstr);

        myconn.Open();

 

        //OleDbCommand mycomm = new OleDbCommand("select BigID,BigClassName from BigClass", myconn);

        SqlCommand mycomm = new SqlCommand("select BigID,BigClassName from BigClass", myconn);

        dr = mycomm.ExecuteReader();

        BigCate.Items.Add(new ListItem("Choose Big Class", "0"));

        while (dr.Read())

        {

            BigCate.Items.Add(new ListItem(dr["BigClassName"].ToString(), dr["BigID"].ToString()));

        }

        myconn.Close();

        myconn.Dispose();

    }

 

    private void getSmailCateValue()

    {

        if (Request.QueryString["BigCateID"] != null)

        {

            int BigCateID;

            string stringSmallCateValue = "";

            DataSet ds = new DataSet();

 

            DataTable dt;

            BigCateID = Int32.Parse(Request.QueryString["BigCateID"].ToString());

 

            //OleDbConnection myconn = new OleDbConnection(connstr);

            SqlConnection myconn = new SqlConnection(connstr);

 

            myconn.Open();

 

            //OleDbCommand mycomm = new OleDbCommand("select SmallID,SmallClassName from [SmallClass] where BigClass=" + BigID + "", myconn);

            SqlCommand mycomm = new SqlCommand("select SmallID,SmallClassName from [SmallClass] where BigClass=" + BigCateID + "" , myconn);

            //OleDbDataAdapter da = new OleDbDataAdapter(mycomm);

            SqlDataAdapter da  = new SqlDataAdapter(mycomm);

 

            da.Fill(ds, "SmallTable");

 

            dt = ds.Tables["SmallTable"];

 

            if (dt.Rows.Count != 0)

            {

                for (int i = 0; i < dt.Rows.Count; i++)

                {

                    stringSmallCateValue += "|" + dt.Rows[i]["SmallClassName"].ToString() + "," + dt.Rows[i]["SmallID"].ToString();

                }

            }

            Response.Write(stringSmallCateValue);

            Response.End();

        }

}   

 

第四步：建立两个表，一个是BigClass，里面的字段为BigID，BigClassName；

BigID	BigClassName
1	书籍
2	工具
3	软件

 

另一个表是SmallClass，里面的字段为SmallID，SmallClassName，BigClass

SmallID	SmallClassName	BigClass
1	Asp.net手册	1
2	SQL语句手册	1
3	下载工具	2
4	图片工具	2