日期时间选择器
日期时间选择器
以基于asp.net mvc框架开发的近乎产品为例，聊一聊他们使用的日期时间选择器。相关源码下载地址：http://www.jinhusns.com/Products/Download?type=whp
概述
功能说明
基于jQuery UI Datepicker （V1.8.7）和 jquery-ui-timepicker-addon 插件构建，并提供了以下主要功能：
- 1.自定义日期格式
- 2. 限制可选择的日期范围
- 3. 可以设置是否选择时间
更多信息请参见：
- jQuery UI datepicker：http://jqueryui.com/demos/datepicker/
- jquery-ui-timepicker-addon：http://trentrichardson.com/examples/timepicker/
示例
自定义日期格式
仅限于使用“y”、“M”、“d”三种格式说明符
查看源代码
限制可选择的日期范围
通过设置minDate、maxDate来限制，可为其设置以下情况的数值：静态日期、整数、空、日期表达式
静态日期:
日期格式，必须和设置的日期格式保持一致，默认设置为“yyyy-MM-dd”
整数:
是指相对于当前日期加多少天，比如：其值为"-2"，当前日期为"2012-01-05",则其对应日期为"2012-01-03"
空:
表示没有限制
日期表达式:
指基于当前日期进行计算的表达式，允许使用的日期单位“Y”、“M”、“W”、“D”，更多说明参见 日期表达式
查看源代码
选择时间
查看源代码
在表单中使用
需在EditModel中，为表单项设置数据标记DataType来使用日期选择器模板。若需要选择时间，可以设置[DataType(DataType.DateTime)]，否则[DataType(DataType.Date)]。
允许在EditModel中，为表单项设置数据标记DateRange来控制用户选择日期的范围， 例如：[DateRange(MinDate = "0", MaxDate= "1W+2d")]， 具体数值设置和限制可选择的日期范围相同
开始时间
置顶截止时间
查看源代码
完整示例
查看源代码
常见问题
日期表达式是什么？
是指基于当前日期进行计算的表达式，使用表达式我们可以很方便的控制日期范围。其有以下特点：
- 表达式可以看作是由多个子项拼接在一起的，允许子项之间有空格
- 每个子项的形式为[符号位][数字位][日期单位]，其中符号位可选值为"+"或"-"，并可以省略符号位
- 日期单位不区分大小写
- 不填日期单位，默认为天
允许使用的日期单位说明如下：
- Y、y - 在当前年份的基础上增加多少年，比如："+12Y"，当前日期为"2012-01-05",表示"2024-01-05"
- M、m - 在当前月份的基础上增加几个月，比如："+2M"，当前日期为"2012-01-05",表示"2012-03-05"
- W、w - 在当前日期的基础上增加多少个周，比如："+1W"，当前日期为"2012-01-05",表示"2012-01-12"
- D、d - 在当前年份的基础上增加多少天，比如："-2D"，当前日期为"2012-01-05",表示"2012-01-03"