Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Does the time picker support timezones? #44

Closed
uberllama opened this issue Feb 2, 2015 · 4 comments
Closed

Does the time picker support timezones? #44

uberllama opened this issue Feb 2, 2015 · 4 comments

Comments

@uberllama
Copy link

Thanks very much for putting this repo together. I'm using moment.js to format my datetimes, which are returned from the server in iso8601 format. Wondering if your time picker is TZ aware, or if I'll have to mutate the value to append the current user's TZ via moment. Cheers.

@jquense
Copy link
Owner

jquense commented Feb 2, 2015

Hey there,

Good question, the datepicker doesn't make any assumptions about timezones, all it expects is a valid Date object as input in the value prop. Mutating the value, once set, will probably not work as all date operations done internally by the widget return a new date instance.

The one place it may not give you what you want is when typing a date into the input and you need to parse that string into a date. I am not sure if the picker will maintain the UTC Offset (my assumption is it will but i am not sure). Luckily if it does not you can easily hook into the picker to make it behave however you want with Moment.js, either through the parse and onChange props. You may want to wrap the widget to encapsulate the behavior more generally like:

var TZDateTimePicker = React.createClass({
  render(){
    return <DateTimePicker {...props}  parse={this._parse} onChange={this._change}/>
  },

  _parse(str){
    var formats = this.props.parse // the user inputed format strings
    return MyTzAwareParseFormat(str, formats) // such as using Moment.js 
  },

  _change(date, dateStr){
    date = EnsureCorrectTz(date) // Moment.js here as well probably?
    this.props.onChange(date)
  }
})

http://jquense.github.io/react-widgets/docs/#/datetime-picker

@uberllama
Copy link
Author

Thanks for your response. I'll give it a whirl!

@jquense
Copy link
Owner

jquense commented Feb 9, 2015

Hope ya found a good answer, feel free to bring anything back up if ya still need some input

@jquense jquense closed this as completed Feb 9, 2015
@truclk
Copy link

truclk commented Aug 1, 2016

I found in the Git repo that using MomentDateTimePicker is suitable for your request.
https://github.com/jquense/react-widgets/blob/9f954b968d0715853f5c7446c498bd9cea07f48b/docs/components/examples/advanced/defaultDatePicker.js

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants