重写 DropDownList 添加optgroup以及为ListItem 加式样(例如 背景色,前景色等)

optgroup 效果很酷,对于小型的二级或者多级下拉菜单如果不想做成连动那么复杂用optgroup 是个不错的办法.

但是, .net DropDownList 并不支持optgroup.同时想自定义ListItem 的样式似乎想一步也做到也不容易.

可以通过重写dropdownlist 一些方法,定义新的dropdownlist类来简单的实现.

public class NewDropDownList:DropDownList
    {
        //重写方法
        protected override void RenderContents(HtmlTextWriter writer) 
        {
            string optgroup; 

            ArrayList optOptionGroups = new ArrayList();

            foreach(ListItem item in this.Items)
            {
                if(item.Attributes["optgroup"] == null) 
                {
                    RenderListItem(item, writer);
                }
                else
                {
                    optgroup = item.Attributes["optgroup"];

                    if(optOptionGroups.Contains(optgroup)) 
                    {
                        RenderListItem(item, writer);
                    } 
                    else 
                    {
                        if(optOptionGroups.Count > 0) 
                        {
                            optgroupEndTag(writer);
                        }
                        optgroupBeginTag(optgroup, writer);
                        optOptionGroups.Add(optgroup);
                    }
                }
            }

            if(optOptionGroups.Count > 0) 
            {
                optgroupEndTag(writer);
            }
        }


        //option 简单添加style
        private void RenderListItem(ListItem item, HtmlTextWriter writer) 
        {
            writer.WriteBeginTag("option");
            writer.WriteAttribute("value", item.Value,true);
            writer.WriteAttribute("style", "color:#7395c1",true);
            if(item.Selected) 
            {
                writer.WriteAttribute("selected", "selected", false);
            }
            foreach(string key in item.Attributes.Keys) 
            {
                writer.WriteAttribute(key, item.Attributes[key]);
            }
            writer.Write(HtmlTextWriter.TagRightChar);
            HttpUtility.HtmlEncode(item.Text, writer);
            writer.WriteEndTag("option");
            writer.WriteLine();
        }

        //option 添加optgroup
        private void optgroupBeginTag(string name, HtmlTextWriter writer) 
        {
            writer.WriteBeginTag("optgroup");
            writer.WriteAttribute("label", name);
            writer.Write(HtmlTextWriter.TagRightChar);
            writer.WriteLine();
        }

        private void optgroupEndTag(HtmlTextWriter writer) 
        {
            writer.WriteEndTag("optgroup");
            writer.WriteLine();
        }
        
        //调用
        public NewDropDownList() 
        {
            ListItem li1 = new ListItem();
            li1.Attributes.Add("optgroup",li.Text);
            Items.Add(li1);
            
            ListItem li2= new ListItem();
            Items.Add(li2);
            
            ListItem li3= new ListItem();
            Items.Add(li3);
            
        }
    }

上面代码已经简单的实现了需求,如果需要更强大的dropdownlist,也可以通过重写等一些方法来实现.