DropDownList自定义控件，让你的分类更清晰
记得上次做论坛，一个功能就是合并2个子板块的主题，用级联的2个DropDownList也是可以完成，那样我们要合并的时候总共就有4个DropDownList控件，觉得界面友好；看到Discuz是2个下拉列表进行合并的，网上找了一些资料，然后写了这个小源码，在这里和大家分享一下！
运行效果图，如下所示（深黑的地方选不中，因为那是上一级的分类）：
项目结构图如下所示：
Controls类库SmartDropDownList.cs代码如下所示：
SmartDropDownList.cs
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Text;
5 using System.Web.UI.WebControls;
6 using System.Web.UI;
7 using System.ComponentModel;
8 using System.Web;
9
10 namespace mydream.Controls
11 {
12 [ToolboxData("<{0}:SmartDropDownList runat=server></{0}:SmartDropDownList>")]
13 public class SmartDropDownList : DropDownList
14 {
15 /// <summary>
16 /// 构造函数
17 /// </summary>
18 public SmartDropDownList() { }
19
20 /// <summary>
21 /// 将控件的内容呈现到指定的编写器中
22 /// </summary>
23 /// <param name="writer"></param>
24 protected override void RenderContents(HtmlTextWriter writer)
25 {
26 OptionGroupRenderContents(writer);
27 }
28
29 /// <summary>
30 /// 呈现Option或OptionGroup
31 /// </summary>
32 /// <param name="writer">writer</param>
33 private void OptionGroupRenderContents(HtmlTextWriter writer)
34 {
35 // 是否需要呈现OptionGroup的EndTag
36 bool writerEndTag = false;
37
38 foreach (ListItem li in this.Items)
39 {
40 // 如果没有optgroup属性则呈现Option
41 if (li.Value != this.OptionGroupValue)
42 {
43 // 呈现Option
44 RenderListItem(li, writer);
45 }
46 // 如果有optgroup属性则呈现OptionGroup
47 else
48 {
49 if (writerEndTag)
50 // 呈现OptionGroup的EndTag
51 OptionGroupEndTag(writer);
52 else
53 writerEndTag = true;
54
55 // 呈现OptionGroup的BeginTag
56 OptionGroupBeginTag(li, writer);
57 }
58 }
59
60 if (writerEndTag)
61 // 呈现OptionGroup的EndTag
62 OptionGroupEndTag(writer);
63 }
64
65 /// <summary>
66 /// 呈现OptionGroup的BeginTag
67 /// </summary>
68 /// <param name="li">OptionGroup数据项</param>
69 /// <param name="writer">writer</param>
70 private void OptionGroupBeginTag(ListItem li, HtmlTextWriter writer)
71 {
72 writer.WriteBeginTag("optgroup");
73
74 // 写入OptionGroup的label
75 writer.WriteAttribute("label", li.Text);
76
77 foreach (string key in li.Attributes.Keys)
78 {
79 // 写入OptionGroup的其它属性
80 writer.WriteAttribute(key, li.Attributes[key]);
81 }
82
83 writer.Write(HtmlTextWriter.TagRightChar);
84 writer.WriteLine();
85 }
86
87 /// <summary>
88 /// 呈现OptionGroup的EndTag
89 /// </summary>
90 /// <param name="writer">writer</param>
91 private void OptionGroupEndTag(HtmlTextWriter writer)
92 {
93 writer.WriteEndTag("optgroup");
94 writer.WriteLine();
95 }
96
97 /// <summary>
98 /// 呈现Option
99 /// </summary>
100 /// <param name="li">Option数据项</param>
101 /// <param name="writer">writer</param>
102 private void RenderListItem(ListItem li, HtmlTextWriter writer)
103 {
104 writer.WriteBeginTag("option");
105
106 // 写入Option的Value
107 writer.WriteAttribute("value", li.Value, true);
108
109 if (li.Selected)
110 {
111 // 如果该Option被选中则写入selected
112 writer.WriteAttribute("selected", "selected", false);
113 }
114
115 foreach (string key in li.Attributes.Keys)
116 {
117 // 写入Option的其它属性
118 writer.WriteAttribute(key, li.Attributes[key]);
119 }
120
121 writer.Write(HtmlTextWriter.TagRightChar);
122
123 // 写入Option的Text
124 HttpUtility.HtmlEncode(li.Text, writer);
125
126 writer.WriteEndTag("option");
127 writer.WriteLine();
128 }
129
130 /// <summary>
131 /// 用于添加SmartDropDownList的分组项的ListItem的Value值
132 /// </summary>
133 [
134 Browsable(true),
135 Description("用于添加DropDownList的分组项的ListItem的Value值"),
136 Category("扩展")
137 ]
138 public virtual string OptionGroupValue
139 {
140 get
141 {
142 string s = (string)ViewState["OptionGroupValue"];
143
144 return (s == null) ? "optgroup" : s;
145 }
146 set
147 {
148 ViewState["OptionGroupValue"] = value;
149 }
150 }
151 }
152 }
smartDropDownList.aspx页面代码如下所示：
smartDropDownList.aspx
1 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="smartDropDownList.aspx.cs" Inherits="smartDropDownList" %>
2
3 <%@ Register Assembly="Controls" Namespace="mydream.Controls" TagPrefix="cc1" %>
4
5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
6
7 <html xmlns="http://www.w3.org/1999/xhtml">
8 <head runat="server">
9 <title></title>
10 </head>
11 <body>
12 <form id="form1" runat="server">
13 <div>
14 <cc1:SmartDropDownList ID="SmartDropDownList1" runat="server">
15 </cc1:SmartDropDownList>
16 </div>
17 </form>
18 </body>
19 </html>
smartDropDownList.aspx页面smartDropDownList.cs如下所示：
smartDropDownList.cs
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.UI;
6 using System.Web.UI.WebControls;
7 using System.Data;
8
9 public partial class smartDropDownList : System.Web.UI.Page
10 {
11 protected void Page_Load(object sender, EventArgs e)
12 {
13 if (!IsPostBack)
14 {
15 this.Bindddlist(this.SmartDropDownList1);
16 }
17 }
18
19 /// <summary>
20 /// 板块ListItem
21 /// </summary>
22 /// <returns></returns>
23 private List<ListItem> GetBoardList()
24 {
25 List<ListItem> list = new List<ListItem>();
26 for (int i = 1; i < 6; i++)
27 {
28 ListItem li = new ListItem("这里是板块"+i,i.ToString());
29 list.Add(li);
30 }
31 return list;
32 }
33
34 /// <summary>
35 /// 子板块ListItem
36 /// </summary>
37 /// <returns></returns>
38 private List<ListItem> GetSubBoardList()
39 {
40 List<ListItem> list=this.GetBoardList();
41 List<ListItem> list_sub = new List<ListItem>();
42 foreach (ListItem li in list)
43 {
44 ListItem li_sub = new ListItem("这一项是上一级的子板块", "这里是你像传递参数的值");
45 list_sub.Add(li_sub);
46 }
47 return list_sub;
48 }
49
50 /// <summary>
51 /// 绑定下拉控件数据
52 /// </summary>
53 private void Bindddlist(mydream.Controls.SmartDropDownList smartddlist)
54 {
55 smartddlist.Items.Clear();
56 List<ListItem> list = this.GetBoardList();
57 foreach (ListItem li in list)
58 {
59 ListItem item = new ListItem("--" + li.Text, "optgroup");
60 smartddlist.Items.Add(item);
61 List<ListItem> list_sub = this.GetSubBoardList();
62 foreach (ListItem li_sub in list_sub)
63 {
64 smartddlist.Items.Add(li_sub);
65 }
66 }
67 smartddlist.DataBind();
68 }
69 }
你可以根据你数据库的设计来绑定值，这里没用数据库，只是说明思路！
版权所有，转载请注明出处！
一切伟大的行动和思想，都有一个微不足道的开始。微不足道的我，正在吸取知识的土壤，希望能取得成功！不嫌弃我微不足道的，愿交天下好友！
