bui.pickerdate Class

Defined in: src/scripts/ui/bui.pickerdate.js:7

Module: UI

日期选择器

日期必须以2015/8/10 这种格式传才能确保在IOS上正常, 支持动态渲染以及静态渲染, 两种的区别就在于,动态渲染初始化简单, 静态渲染灵活,支持自定义按钮样式,并且支持左右侧滑.

可以同时有左边跟右边菜单,菜单的个数也可以不一样多,留意示例的几种不同效果

预览地址: demo

方法说明:

value: 设置日期
min: 设置最小日期
max: 设置最大日期
reset: 重新渲染
onChange: 日期变更事件回调
formatValue: 数据格式化方法
cols: 设置分栏
widget: since1.3.0 获取依赖

Constructor

`bui.pickerdate`

(

option

)

Defined in src/scripts/ui/bui.pickerdate.js:7

Parameters:

option Object
- id String
  
  [ 日期生成的容器, 同时需要设置 popup:false ]
- [handleParent] [ 1.6.2新增, 如果这组日期是动态创建的dom, 可以设置已知的父级容器] Boolean optional
- [handle] [ 触发弹窗的选择器, 1.5.3支持样式选择器,多个日期,只需要初始化一个] Boolean optional
- [bindValue] [ 1.5.3 新增, 默认:false|true, 修改的值会自动绑定到 handle, 不再需要自己去绑定] Boolean optional
- [popup] [ 是否弹出窗口默认 true || false] Boolean optional
- [mask] [ 是否显示遮罩默认 true || false] Boolean optional
- [zIndex] [ 层级默认 110] Number optional
- [buttons] [ since 1.3.0 如果buttons是一个数组,则底部会增加相应的按钮格式为 ["确定","取消"] || [{name:"确定",className:"primary"}]] Array optional
- [value] [ 初始化第一个日期,日期格式 2015/8/10 9:00] String optional
- [min] [ 最小日期,日期格式 2015/8/10 9:00, 不能传 new Date()] String | Date optional
- [max] [ 最大日期,日期格式 2015/8/10 9:00, 不能传 new Date()] String | Date optional
- [formatValue] [ since 1.3.0 显示的日期格式, 默认: yyyy-MM-dd hh:mm:ss] Function optional
- [cols] [ 分栏] Object optional
- cols.year Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- cols.month Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- cols.date Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- cols.hour Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- cols.minute Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- cols.second Object | "none"
  
  [ 不需要某栏,设置为 "none" 格式: { values: [],displayValues:[] } ]
- [appendTo] [ 1.4.3新增默认:"body",添加到哪里去,主要配合单页使用] String | Object optional
- [onBeforeInit] [ 1.5.1新增初始化前触发] Function optional
- [onInited] [ 1.5.1新增初始化以后触发] Function optional
- [rotateEffect] [ 是否开启3D效果,默认:false] Boolean optional
- [onChange] [ 回调] Function optional
- [callback] [ 点击确定的回调] Function optional

Example:

       // 1. 简单初始化
                                       //1.5.3 新增 bindValue, 设置 true, 会自动把值绑定到指定的handle.
                                
                                       var uiPickerdate = bui.pickerdate({
                                           handle:"#datepicker_input",
                                           bindValue: true,
                                           onChange: function(value) {
                                               console.log(value);
                                           }
                                       });
                                
                                   // 2. 分离式初始化: 需要自己指定value设置到哪里.
                                       var input = $("#datepicker_input");
                                       var uiPickerdate = bui.pickerdate({
                                           handle:"#datepicker_input",
                                           onChange: function(value) {
                                               input.val(value);
                                           }
                                       });

Index
Methods
Events

Item Index

Methods

close
cols
destroy
disabled
empty
enabled
formatDate
formatValue
isOpen
max
min
modifyTitle
onChange
open
reset
value
widget

Events

Methods

`close`

() chainable

Defined in src/scripts/ui/bui.pickerdate.js:984

Available since 1.5.3

关闭窗口

Example:

           uiPickerdate.close();

`cols`

(

cols

)

Defined in src/scripts/ui/bui.pickerdate.js:268

设置分栏

Parameters:

cols Object

[ {} ]
- year Object
  
  [ 'none' || 年份 ]
  - values Array
    [ 年份的值 ]
  - displayValues Array
    [ 年份的值对应的文本 ]
- month Object
  
  [ 'none' || 月份 ]
  - values Array
    [ 月份的值 ]
  - displayValues Array
    [ 月份的值对应的文本 ]
- date Object
  
  [ 'none' || 日 ]
  - values Array
    [ 日 ]
  - displayValues Array
    [ 日对应的文本 ]
- hour Object
  
  [ 'none' || 时 ]
  - values Array
    [ 时 ]
  - displayValues Array
    [ 时对应的文本 ]
- minute Object
  
  [ 'none' || 分 ]
  - values Array
    [ 分 ]
  - displayValues Array
    [ 分对应的文本 ]
- second Object
  
  [ 'none' || 秒 ]
  - values Array
    [ 秒 ]
  - displayValues Array
    [ 秒对应的文本 ]

Example:

           //设置分栏
                                                       uiPickerdate.cols({
                                                           year: {
                                                               values: [2013, 2014, 2015],
                                                           },
                                                           hour: {
                                                               values: [8, 9, 10, 11, 13, 14, 15, 16, 17]
                                                           },
                                                           minute: {
                                                               values: [0, 30],
                                                               displayValues: ['00', '30']
                                                           },
                                                           second: 'none'
                                                       });

`destroy`

(

[bool] [ 默认: false 销毁部分 | true 销毁全部]

)

Defined in src/scripts/ui/bui.pickerdate.js:1038

Available since 1.4.2

[销毁控件]

Parameters:

[bool] [ 默认: false 销毁部分 | true 销毁全部] Boolean optional

Example:

           //销毁
                                                       uiPickerdate.destroy();

`disabled`

() chainable

Defined in src/scripts/ui/bui.pickerdate.js:933

Available since 1.4

阻止触发

Example:

           uiPickerdate.disabled();

`empty`

()

Defined in src/scripts/ui/bui.pickerdate.js:387

Available since 1.5.6

清空值,必须在控件初始化以后再执行.

Example:

           //
                                                       uiPickedate.empty();

`enabled`

() chainable

Defined in src/scripts/ui/bui.pickerdate.js:1021

Available since 1.4

允许触发

Example:

           uiPickerdate.enabled();

`formatDate`

(

[date] [ "2019-11-01"]
[pattern] [ "yyyy-MM-dd hh:00:00"]

)

Defined in src/scripts/ui/bui.pickerdate.js:564

格式化后回调

Parameters:

[date] [ "2019-11-01"] String optional
[pattern] [ "yyyy-MM-dd hh:00:00"] String optional

Example:

           //设置某个日期
                                                       uiPickedate.formatDate("yyyy-MM-dd hh:00:00");

`formatValue`

(

[str] [ "yyyy-MM-dd hh:00:00"]

)

Defined in src/scripts/ui/bui.pickerdate.js:511

格式化后回调

Parameters:

[str] [ "yyyy-MM-dd hh:00:00"] String optional

Example:

           //设置某个日期
                                                       uiPickedate.formatValue("yyyy-MM-dd hh:00:00");

`isOpen`

() chainable

Defined in src/scripts/ui/bui.pickerdate.js:968

Available since 1.5.3

是否打开状态

Example:

           uiPickerdate.isOpen();

`max`

(

[max] [ 默认最大日期:'2030/01/01 00:00:00']

)

Defined in src/scripts/ui/bui.pickerdate.js:422

设置最大日期

Parameters:

[max] [ 默认最大日期:'2030/01/01 00:00:00'] String optional

Example:

           //设置最大日期
                                                       uiPickedate.max('2030/01/01 00:00:00');

`min`

(

[min] [ 默认最小日期:'1960/01/01 00:00:00']

)

Defined in src/scripts/ui/bui.pickerdate.js:405

设置最小日期

Parameters:

[min] [ 默认最小日期:'1960/01/01 00:00:00'] String optional

Example:

           //设置最小日期
                                                       uiPickedate.min('1960/01/01 00:00:00');

`modifyTitle`

(

content

)

chainable

Defined in src/scripts/ui/bui.pickerdate.js:1002

Available since 1.5.6

修改标题文本, 只有刚开始标题有内容才可以修改

Parameters:

content String

[文本]

Example:

           uiPickerdate.modifyTitle("标题名称");

`onChange`

(

[callback] [ 日期改变实时监听回调]

)

Defined in src/scripts/ui/bui.pickerdate.js:601

日期改变的回调

Parameters:

[callback] [ 日期改变实时监听回调] Function optional

Example:

           //设置某个日期
                                                       uiPickedate.onChange(function(value) {
                                                           // body...
                                                       });

`open`

() chainable

Defined in src/scripts/ui/bui.pickerdate.js:951

Available since 1.5.3

打开窗口

Example:

           uiPickerdate.open();

`reset`

()

Defined in src/scripts/ui/bui.pickerdate.js:368

重新渲染

Example:

           //重置
                                                       uiPickedate.reset();

`value`

(

[date] [ 日期格式:'2030/01/01 00:00:00']

)

Defined in src/scripts/ui/bui.pickerdate.js:439

设置某个日期

Parameters:

[date] [ 日期格式:'2030/01/01 00:00:00'] String optional

Example:

           //设置某个日期
                                                       uiPickedate.value('2016/07/01 00:00:00');

`widget`

(

[name] [ 依赖控件名 dialog]

)

Defined in src/scripts/ui/bui.pickerdate.js:1060

获取依赖的控件

Parameters:

[name] [ 依赖控件名 dialog] String optional

Example:

               //获取依赖控件
                                                           var uiPickerdateWidget = uiPickerdate.widget();

Events

`off`

Defined in src/scripts/ui/bui.pickerdate.js:1098

Available since 1.3.0

为控件取消绑定事件

Event Payload:

[type] [ 事件类型: "change"(日期改变的时候) | "show"(日期展示的时候)| "hide"(日期隐藏的时候)] String optional
[callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

           uiPickerdate.off("show");

`on`

Defined in src/scripts/ui/bui.pickerdate.js:1078

Available since 1.3.0

为控件绑定事件

Event Payload:

[type] [ 事件类型: "change"(日期改变的时候) | "show"(日期展示的时候)| "hide"(日期隐藏的时候)] String optional
[callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

           uiPickerdate.on("show",function () {
                                                           // 点击的菜单
                                                           console.log(this);
                                                       });

BUI

bui.pickerdate Class

日期选择器

预览地址: demo

方法说明:

Constructor

bui.pickerdate

Parameters:

Example:

Item Index

Methods

Events

Methods

close

Example:

cols

Parameters:

Example:

destroy

Parameters:

Example:

disabled

Example:

empty

Example:

enabled

Example:

formatDate

Parameters:

Example:

formatValue

Parameters:

Example:

isOpen

Example:

max

Parameters:

Example:

min

Parameters:

Example:

modifyTitle

Parameters:

Example:

onChange

Parameters:

Example:

open

Example:

reset

Example:

value

Parameters:

Example:

widget

Parameters:

Example:

Events

off

Event Payload:

Example:

on

Event Payload:

Example:

`bui.pickerdate`

`close`

`cols`

`destroy`

`disabled`

`empty`

`enabled`

`formatDate`

`formatValue`

`isOpen`

`max`

`min`

`modifyTitle`

`onChange`

`open`

`reset`

`value`

`widget`

`off`

`on`