hlsDateTimePicker.md 2.12 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88
# 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**等本该是**时间类型**的属性,改为日期字符串,且连接符号为"**-**"