三级联动.

Posted on 2006-03-20 21:39 laifangsong 阅读(1804) 评论(6) 收藏举报

之前写了一篇2级联动的，将其修改，就可以得到3级联动菜单。

BigClass

        表结构：

        测试数据：


SmallClass1

        表结构：

         测试数据：


SmallClass2

        表结构：

        测试数据：


aspx页面：


aspx代码：

<%@ Page language="c#" Codebehind="liandong_three.aspx.cs" AutoEventWireup="false" Inherits="AspNetTest.Common.liandong_three" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

<HEAD>

<title>liandong_three</title>

function change1()

{

var obj = document.Form1.DropDownList1;

if(obj.selectedIndex == 0)

{

document.Form1.DropDownList2.length =1;

return;

}

var bigClassId = obj.options[obj.selectedIndex].value;

var obj = document.Form1.DropDownList2;

obj.length = 0;

obj.options[0] = new Option("=选择小类1=", "");

var len = 0;

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

{

if(arrSmallClass1[i][2] == bigClassId)

{

obj.options[++len] = new Option(arrSmallClass1[i][1], arrSmallClass1[i][0]);

}

function change2()

{

var obj = document.Form1.DropDownList2;

if(obj.selectedIndex == 0)

{

document.Form1.DropDownList3.length =1;

return;

}

var smallClassId1 = obj.options[obj.selectedIndex].value;

var obj = document.Form1.DropDownList3;

obj.length = 0;

obj.options[0] = new Option("=选择小类2=", "");

var len = 0;

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

{

if(arrSmallClass2[i][2] == smallClassId1)

{

obj.options[++len] = new Option(arrSmallClass2[i][1], arrSmallClass2[i][0]);

}

</script>

</HEAD>

<asp:DropDownList id="DropDownList1" style="Z-INDEX: 100; LEFT: 40px; POSITION: absolute; TOP: 40px"

runat="server"></asp:DropDownList>

<asp:DropDownList id="DropDownList3" style="Z-INDEX: 103; LEFT: 216px; POSITION: absolute; TOP: 40px"

runat="server"></asp:DropDownList>

<asp:DropDownList id="DropDownList2" style="Z-INDEX: 102; LEFT: 128px; POSITION: absolute; TOP: 40px"

runat="server"></asp:DropDownList></FONT></form>

</body>

</HTML>

cs代码：

using System;
2

using System.Text;
3

using System.Collections;
4

using System.ComponentModel;
5

using System.Data;
6

using System.Data.SqlClient;
7

using System.Drawing;
8

using System.Web;
9

using System.Web.SessionState;
10

using System.Web.UI;
11

using System.Web.UI.WebControls;
12

using System.Web.UI.HtmlControls;
13

namespace AspNetTest.Common
15

{
16

/// <summary>
17

/// liandong_three 的摘要说明。
18

/// </summary>
19

public class liandong_three : System.Web.UI.Page
20

{
21

protected System.Web.UI.WebControls.DropDownList DropDownList1;
22

protected System.Web.UI.WebControls.DropDownList DropDownList2;
23

protected System.Web.UI.WebControls.DropDownList DropDownList3;
24

private void Page_Load(object sender, System.EventArgs e)
26

{
27

BindDDLCreateJsdArray();
30

// 在此处放置用户代码以初始化页面
32

}
33

private void BindDDLCreateJsdArray()
34

{
35

string ConnectionString = System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
36

SqlConnection conn = new SqlConnection(ConnectionString);
37

string sql = "select b.d_name as bname,b.d_id as bid,s.d_id as sid,s.d_name as sname,ss.d_id as ssid,ss.d_name as ssname from SmallClass1 s,BigClass b,SmallClass2 ss where b.d_id=s.d_classid and s.d_id=ss.d_classid";
38

SqlCommand cmd = new SqlCommand(sql, conn);
39

conn.Open();
40

SqlDataReader dr = cmd.ExecuteReader();
41

StringBuilder sb = new StringBuilder();
42

sb.Append("<script language=javascript>\n");
43

//定义JS数组
44

sb.Append("var arrSmallClass2 = new Array();\n");
45

sb.Append("var arrSmallClass1 = new Array();\n");
46

ListItem lt = new ListItem("=选择大类=", "");
DropDownList1.Items.Clear();
47

DropDownList1.Items.Add(lt);
48

lt = new ListItem("=选择小类1=", "");
49

DropDownList2.Items.Add(lt);
50

lt = new ListItem("=选择小类2=", "");
51

DropDownList3.Items.Add(lt);
52

int i = 0;
53

int j = 0;
54

int PreBigClassId = 0;
55

int PreSmallClass1Id = 0;
56

while(dr.Read())
57

{
58

string BigClassName = dr["bname"].ToString();
59

int BigClassId = Convert.ToInt32(dr["bid"].ToString());
60

string SmallClass1Name = dr["sname"].ToString();
61

int SmallClass1ID = Convert.ToInt32(dr["sid"].ToString());
62

string SmallClass2Name = dr["ssname"].ToString();
63

int SmallClass2ID = Convert.ToInt32(dr["ssid"].ToString());
64

lt = new ListItem(BigClassName, BigClassId.ToString());
65

//防止创建重复值
66

if(BigClassId != PreBigClassId)
67

{
68

DropDownList1.Items.Add(lt);
69

PreBigClassId = BigClassId;
70

}
71

lt = new ListItem(SmallClass1Name, SmallClass1ID.ToString());
72

if(SmallClass1ID != PreSmallClass1Id)
73

{
74

DropDownList2.Items.Add(lt);
75

PreSmallClass1Id = SmallClass1ID;
76

/*
77

给JS数组赋值。
78

注意：JS中不能直接创建二维数组，要创建可以这样
79

var arrTest = new Array();
80

arrTest[0] = new Array();
81

arrTest[0][0] = 1
82

*/
83

sb.Append("arrSmallClass1["+ j +"] = new Array();\n");
84

sb.Append("arrSmallClass1["+ j +"][0] = " + SmallClass1ID.ToString() + ";\n");
85

sb.Append("arrSmallClass1["+ j +"][1] = \"" + SmallClass1Name + "\";\n");
86

sb.Append("arrSmallClass1["+ j +"][2] = " + BigClassId + ";\n");
87

j++;
88

}
89

sb.Append("arrSmallClass2["+ i +"] = new Array();\n");
90

sb.Append("arrSmallClass2["+ i +"][0] = " + SmallClass2ID.ToString() + ";\n");
91

sb.Append("arrSmallClass2["+ i +"][1] = \"" + SmallClass2Name + "\";\n");
92

sb.Append("arrSmallClass2["+ i +"][2] = " + SmallClass1ID + ";\n");
93

i++;
94

}
95

sb.Append("</script>");
96

//将JS字符串输出到客户端
97

Page.Response.Write(sb.ToString());
98

//大类change事件
99

DropDownList1.Attributes.Add("onchange", "change1();change2()");
100

//小类1change事件
101

DropDownList2.Attributes.Add("onchange", "change2();");
102

}
103

Web 窗体设计器生成的代码
123

}
124

}
125

刷新页面返回顶部

laifangsong's .NET blog

公告

三级联动.