编写“日期选择器”的简单方法!






2.65/5 (26投票s)
2004年10月30日
2分钟阅读

80776

1388
使用日历控件和样式表实现的一个日期选择器。
引言
你是否曾经想过编写自己的炫酷日期选择器?市面上有很多,但许多实现起来都很困难,难以集成到你现有的代码中。这个不同之处在于它只包含五行代码(不包括CSS代码)!
它是如何工作的?
在这个示例中,包含一个Button
,TextBox
,Panel
,当然,还有一个Calendar
Web控件。启动时,有一个文本框和一个按钮。点击按钮以显示日历。点击日历选择日期,日历消失。然后你选择的日期出现在文本框中。
点击按钮。
从日历中选择一个日期。
所选日期出现在文本框中。
逻辑
我使用一个Panel
Web控件来容纳Calendar
Web控件。我还为Panel
定义了两种CSS样式。一种用于显示Panel
,另一种用于隐藏Panel
。点击按钮会将隐藏和显示CSS样式分配给Panel
。这就是日历显示和消失的方式。
技巧
这个日期选择器能够工作的小窍门,或者说“关键”,是Panel
Web控件。第一次尝试时,我没有使用Panel
,而是将CSS样式分配给Calendar
Web控件。然后,问题是星期名称不会显示。然后我将显示样式的定位从绝对定位改为相对定位。它随后显示了星期名称,但也向下推了文本框。然后,我尝试使用PlaceHolder
Web控件,甚至其他Web控件,但Panel
Web控件效果最好。
如何使用它?
你可能无法直接使用我的代码,但你可以查看我的代码并创建自己的日期选择器或日历。我更喜欢使用原始组件开发应用程序,而不是编写一个完整的类或怪物来完成一些小事情。
只需下载源代码并将其解压缩到你的wwwroot文件夹中,然后编译并运行。你可能需要在IIS中配置Web应用程序名称才能使其工作。