# HlsDateTimePicker标签 时间选择器(带时分秒) ### **主要属性** 属性名 | 类型 -------- | ----- promptColspan | Integer promptClassName | className id | String promptImage | String prompt | String colspan | String hlsClassName | String animation | Boolean ARIATemplate| String culture | String depth| String footer| String & Function format| String max| String min| String start| String value | String name | String bind | Function required | Boolean change | Function close| Function open | Function placeholder | String interval |Integer timeFormat |String > **提示:** 属性用法请参考kendoui API文档 http://docs.telerik.com/kendo-ui/api/javascript/ui/datetimepicker ### **用法示例** ```javascript //注意是写在script标签内的 var viewModel = kendo.observable({ data:{}, isEnabled:true }); function open(){ //... } function change(e){ //... } ``` ```xml <h:hlsDateTimePicker name="hlsDateTimePicker" id="hlsDateTimePicker" colspan="3" bind="enabled:isEnabled,value:data.hlsDateTimePicker" prompt="上会时间" promptColspan="1" required="true" style="width:100%" max="2016-6-6" open="open" /> id:可写可不写 bind:属性里面包含配置两个选项: (1)enabled配置日期选择器是否可以编辑,值为Boolean类型的变量,在viewModel里面配置 (2)value配置日期选择器与变量关联,默认是在ViewModel下面的变量 max:可选择日期的上限值 style可改变该控件的样式 open:点击控件调用的方法 change:选择日期之后的事件 prompt:为控件添加一个label,该属性一般和<h:hlsForm>、<h:hlsHBox>一起使用 colspan:时间选择器的宽度(按照bootstrap,列12等分来计算) promptColspan:label的宽度 ``` > **提示:** > - 上述所有属性直接添加在标签内即可,(**[属性名] = "..."**),对于既是**String**类型又是**Function**类型的属性,只需要加**fn:**前缀区分即可,(**fn:函数名**) > - 对于**max min**等本该是**时间类型**的属性,改为日期字符串,且连接符号为"**-**"