发布一款层次下拉列表控件

简介:

在项目中经常遇到树状结构的对象比如产品分类、部门结构、地区……对于这类对象的呈现,一般都使用树控件(比如VS2005自带的TreeView控件)。但是树控件的使用和操作都比较复杂,对于一些比较简单的操作,比如单选其中的一个节点的情况则可用使用下拉列表框来代替。要在DropDownList中展示出树结构的层次,那就必须在每个节点的Text前加入一定的占位符,以实现层次的效果,比如:

由于这种下拉列表控件在项目中经常使用,于是决定写一个通用的服务器控件出来。该控件继承自DropDownList,在使用中只需要为该控件设置用于数据绑定的DataTextField和DataValueField,以及新增的属性ChildProperty(string,对象的Child属性的名字)和DeepChar(string,在表示层次中使用的占位符,默认是“--”),设置了这4个属性后,在后台就只需要将树结构对象的Root节点作为DataSource,然后执行DataBind()即可。

 


using System;
using System.Collections.Generic;
using System.Collections;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; 

namespace ServerControls
{
    [ToolboxData(
"<{0}:DropDownTreeList runat=server></{0}:DropDownTreeList>")]
    
public class DropDownTreeList : DropDownList
    
{
        
private object dataSource;
        
private int deep = 0

        
----重写---- 

        
----私有方法----
        
----公开的属性----
    }

}
 

 

具体调用示例:

1,将该控件添加到aspx页面中并设置必要的属性。

< cc1:DropDownTreeList ID = " DropDownTreeList1 "  runat = " server "  
                ChildProperty
= " ChildArea "  DataTextField = " Name "  DataValueField = " Code "  
                DeepChar
= " -- " >  

2,在页面的后台代码中添加数据源并进行数据绑定。


public partial class _Default : System.Web.UI.Page 
{
    
protected void Page_Load(object sender, EventArgs e)
    
{
        
this.DropDownTreeList1.DataSource = InitArea();
        
this.DropDownTreeList1.DataBind();
    }
 

    
private Area InitArea()
    
{
        Area area1 
= new Area { Code = 1, Name = "中国" };
        Area area2 
= new Area { Code = 2, Name = "四川" };
        Area area3 
= new Area { Code = 3, Name = "北京" };
        Area area4 
= new Area { Code = 4, Name = "广东" };
        Area area5 
= new Area { Code = 5, Name = "成都" };
        Area area6 
= new Area { Code = 6, Name = "乐山" };
        Area area7 
= new Area { Code = 7, Name = "绵阳" };
        Area area8 
= new Area { Code = 8, Name = "广州" };
        Area area9 
= new Area { Code = 9, Name = "深圳" };
        Area area10 
= new Area { Code = 10, Name = "东莞" };
        Area area11 
= new Area { Code = 11, Name = "珠江" }

        area1.ChildArea 
= new List<Area> { area2, area3, area4 };
        area2.ChildArea 
= new List<Area> { area5, area6, area7 };
        area4.ChildArea 
= new List<Area> { area9, area10, area11 };
        
return area1;
    }

}

public class Area
{
    
public string Name getset; }
    
public int Code getset; }
    
public List<Area> ChildArea getset; }
}
 

运行后的效果就是: 

由于本人接触服务器控件开发的时间并不长,对服务器控件开发经验还不足,该控件有需要改进或有错误的地方希望大家指正。

另外这个控件目前我发现的一个问题就是我将DataBind方法完全重写了,所以控件的DataTextFormatString失效了,由于很少使用这个属性,所以一般不影响使用。不知道有什么办法能够解决这个问题?

目录
相关文章
|
7月前
|
开发框架 缓存 前端开发
使用扩展函数方式,在Winform界面中快捷的绑定树形列表TreeList控件和TreeListLookUpEdit控件
使用扩展函数方式,在Winform界面中快捷的绑定树形列表TreeList控件和TreeListLookUpEdit控件
|
10月前
【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。
【sgSearch】自定义组件:常用搜索栏筛选框组件(包括表格高度变化兼容)。
ArcGIS:如何新建图层组并添加数据、切换数据视图和布局视图、修改符号系统?
ArcGIS:如何新建图层组并添加数据、切换数据视图和布局视图、修改符号系统?
404 0
ArcGIS:如何新建图层组并添加数据、切换数据视图和布局视图、修改符号系统?
|
小程序 算法 前端开发
小程序之移花宫-自定义底部标签图标---【浅入深出系列005】
小程序之移花宫-自定义底部标签图标---【浅入深出系列005】
|
前端开发 Android开发 iOS开发
Andorid分组Item顶部悬停 + 交互同步
  项目中某些页面中的分组数据的顶部需要悬停,并且悬停的View要与ItemView中同样布局的View进行操作同步,也就是相互同步。大家都知道,Android中有"The specified child already has a parent. You must call removeView() on the child's parent first."这个异常,意味着同一个View对象不能有两个Parent。我们就不能简单粗暴的将同一个View对象添加进两个parent了,需要另谋出路。
|
Java Android开发
移动应用程序设计基础——点菜单列表实现
进一步理解Android各种控件的使用,加深控件的属性、方法的使用,熟练掌握ListView控件的使用,熟练掌握对话框的使用。 实现点菜单列表 1.1布局结构 列表布局分为两大部分,上半部分显示列表内容,底部显示所有菜品的总价; 菜品项如图所示包括 1.图片,图片格式120*120; 2.标题,居中,android:textAppearance="?android:attr/textAppearanceLarge", 3.菜品介绍内容,最多显示3行,超过部分用…表示,android:textAppearan
206 0
移动应用程序设计基础——点菜单列表实现
|
移动开发 JavaScript weex
uniapp原生子窗体subNvue的使用超容易理解的总结,解决覆盖不了视频或者地图等层级问题
uniapp原生子窗体subNvue的使用超容易理解的总结,解决覆盖不了视频或者地图等层级问题
2378 0
uniapp原生子窗体subNvue的使用超容易理解的总结,解决覆盖不了视频或者地图等层级问题
|
C#
WPF关于控件 父级控件,子级控件,控件模板中的控件,等之间的相互访问
原文:WPF关于控件 父级控件,子级控件,控件模板中的控件,等之间的相互访问 1,在菜单中访问 弹出菜单的控件 var mi = sender as MenuItem;//菜单条目 MenuItem var cm = mi.
1011 0
|
Android开发
QTQuick控件基础(2)
import QtQuick 2.2import QtQuick.Controls 1.2import QtQuick.Window 2.1ApplicationWindow {    visible: true    width: 640    height: 480    title: qsTr...
1028 0