在项目开发中,我们经常会通过使用列表框或组合框来解决选择问提。
但在列表框中,容纳的信息实在是有限,而且显示的条目也不能一次
性太多,那样对用户的操作也会造成不便。
有时可以通过用其它控件来替换掉列表框的展现部分,比如使用DataView或
DataList控件等,这可用自定义控件或用户控件来完成,这里介绍一个
常用的简单方法(使用用户控件)。
源码下载
方法是:
先建立一个ascx控件.
\n
(1)
ascx控件中再分出”txtDiv”和”listDiv”两个Div层.
“txtDiv”层中使用Css将内嵌的Label和div等Html元素,画出伪列表框样式.
“listDiv”层则通过一个DataList,负责将”伪列表框”的内容展现出来.
\n
之所以各使用独立的div是为了能通过客户端脚本来模拟列表框的展开和收缩,
能及时的将”listDiv”层显示和隐藏起来.
\n
(2)
为”listDiv”层的DataList添加搜索和分页功能,这样再多的内容也无须担心。
DataList的列中还需有一个选中列,这样当前选中项的文本和值,才能通过脚本。
将其转移到对应的隐藏控件中。
\n
(3)
父页面通过ascx控件的ItemText和ItemValue属性,
读取ascx页中的隐藏控件,来得到当前选中项的文本和值。
\n
最后的使用效果为:
(图1-初始界面)
(图2-显示列表)
(图3-搜索和翻页)
(图4-选中后隐藏显示列表)
(图5-显示选中结果)
ascx控件的主要属性说明:
\n
PageSize :列表的页尺寸
TableName :读取的数据表名
ItemText :数据表中用作项文本的字段
ItemValue :数据表中用作项值的字段
\n
GetValue :得到当前的选中值.
GetText :得到当前的选中文本.
来源:oupatch的cnblogs