Element: [Feature Request] Allow timezone to be set as a property for Date/Time Picker

Created on 24 Oct 2017 · 9Comments · Source: ElemeFE/element

Existing Component

Yes

Component Name

DatePicker / TimePicker

Description

Current Behavior:
Date and Time Picker always convert dates to the user's local time. For example, if the ISO 8601 date 2017-10-24 is passed in as a selected date, users in a timezone behind UTC (for example, in the US), will see 2017-10-23 as the selected day (2017-10-24 is Mon Oct 23 2017 20:00:00 GMT-0400 (EDT) for US Eastern Standard Time).

Requested Behavior:
Date and Time Picker should allow the displayed timezone to be set as an attribute, ie:
<el-date-picker timezone="UTC"></el-date-picker>. Allowing the timezone to be shown in the UI and selectable by the user would be a bonus.

Source

dak

👍13

Most helpful comment

This was closed, although I believe #9133 was asking for something slightly different. Parsing by dateString in JavaScript defaults to UTC; however, a patch was added recently to force parsing by local timezone instead.

Since local and UTC are the two most common needs, and JavaScript parses dateStrings as UTC by default, would it be possible to have an attribute that allowed choosing between local or UTC? It should be as simple as just bypassing the local conversion that Element is currently doing.

Something like:
<el-date-picker :localTime="false"></el-date-picker> and default to true to maintain the current behavior.

dak on 8 Mar 2018

👍5

All 9 comments

👍 +1 for this request

lucduong on 31 Oct 2017

drkwolf on 2 Jan 2018

https://github.com/ElemeFE/element/issues/9133

Leopoldthecoder on 7 Jan 2018

😕1

Something like:
<el-date-picker :localTime="false"></el-date-picker> and default to true to maintain the current behavior.

dak on 8 Mar 2018

👍5

I also encountered this problem, where I set the initial value to 2018-04-08, and in some US timezone, it is displayed as 2018-04-07, but the actual value is 2018-04-08, which is very confusing.

dongli on 8 Apr 2018

I have a timezone heavy application and I manually take care where to display time and dates in UTC and where to format into the right timezone. Element forcing the usage of local timezone means I can't use this component even if I pass the right UTC date into the component.