my.datePicker
Use this API to open the date selection list.
Sample code
index.json
copy
// API-DEMO page/API/date-picker/date-picker.json
{
"defaultTitle": "Date Picker"
}
index.axml
copy
<!-- API-DEMO page/API/date-picker/date-picker.axml -->
<view class="page">
<view class="page-description">Date picker API</view>
<view class="page-section">
<view class="page-section-title">my.datePicker</view>
<view class="page-section-demo">
<button class="page-body-button" type="primary" onTap="datePicker">Pick Date-1</button>
<button class="page-body-button" type="primary" onTap="datePickerHMS">Pick Date-2</button>
<button class="page-body-button" type="primary" onTap="datePickerYMDHMS">Pick Date-3</button>
</view>
</view>
</view>
index.js
copy
// API-DEMO page/API/date-picker/date-picker.js
Page({
datePicker() {
my.datePicker({
currentDate: '2016-10-10',
startDate: '2016-10-9',
endDate: '2017-10-9',
success: (res) => {
my.alert({
title: 'datePicker response: ' + JSON.stringify(res)
});
},
});
},
datePickerHMS() {
my.datePicker({
format: 'HH:mm',
currentDate: '12:12',
startDate: '11:11',
endDate: '13:13',
success: (res) => {
my.alert({
title: 'datePicker response: ' + JSON.stringify(res)
});
},
});
},
datePickerYMDHMS() {
my.datePicker({
format: 'yyyy-MM-dd HH:mm',
currentDate: '2012-01-09 11:11',
startDate: '2012-01-01 11:11',
endDate: '2012-01-10 11:11',
success: (res) => {
my.alert({
title: 'datePicker response: ' + JSON.stringify(res)
});
},
});
},
});
index.acss
copy
/* API-DEMO page/API/date-picker/date-picker.acss */
button + button {
margin-top: 20rpx;
}
Parameters
Property | Type | Required | Description |
format | String | No | The returned date format. |
currentDate | String | No | The date and time initially selected. By default, the current time date and time are used. |
startDate | String | No | Minimum date and time. |
endDate | No | Maximum date and time. | |
success | Function | Yes | The callback function for a successful API call. |
fail | Function | Yes | The callback function for a failed API call. |
complete | Function | Yes | The callback function used when the API call is completed. This function is always executed no matter the call succeeds or fails. |
The returned date formats include:
- yyyy-MM-dd (default)
- HH:mm
- yyyy-MM-dd HH:mm
- yyyy-MM. Pass in
canIUse('datePicker.object.format.yyyy-MM')
to my.canIUse to query if the current version can be used.
- yyyy. Pass in
canIUse('datePicker.object.format.yyyy')
to my.canIUse to query if the current version can be used.
Success callback function
Property | Type | Description |
date | String | The selected date. |
Error Code
Error Code | Description | Solution |
11 | The user cancelled the operation. | The user cancelled the operation and no action is required. |