Comments (2)
You want to look at the Parsing section of moment.js : http://momentjs.com/docs/#/parsing/
Hence you need in the format
prop to specify something like "YYYY/MM/DD h:mm A"
. inputFormat
on the other just specify how the date is going to look like in the input field, I realized now that it's a bit confusing because it's like the output..
from react-bootstrap-datetimepicker.
Per moment.js docs, it's not necessary to specify a format to parse a date when working with ISO date strings.
And their docs also say that it's possible to specify ISO format explicitly if wanted:
" Moment already supports parsing iso-8601 strings, but this can be specified explicitly in the format/list of formats when constructing a moment."
moment("2010-01-01T05:06:07", moment.ISO_8601);
They do warn us that a format is necessary when NOT using ISO dates.
"For consistent results parsing anything other than ISO 8601 strings, you should use String + Format."
"Note: Automatic cross browser ISO-8601 support was added in version 1.5.0. Support for the week and ordinal formats was added in version 2.3.0.
So there is no need to provide a format when the input is a date with ISO-8601.
From here: http://momentjs.com/docs/#/parsing/special-formats/
I would expect the same from the react-picker component and should be able to do it this way:
let myISODate = 'Some valid ISO Date';
<DateTimeField
inputFormat="YYYY/MM/DD h:mm A"
dateTime={myISODate} />
or maybe something like this:
let myISODate = 'Some valid ISO Date';
<DateTimeField
inputFormat="YYYY/MM/DD h:mm A"
format={moment.ISO_8601}
dateTime={myISODate} />
Then the onChange event should return a ISO String too.
Default format
As of version 1.5.0, calling moment#format without a format will default to moment.defaultFormat. Out of the box, moment.defaultFormat is the ISO8601 format YYYY-MM-DDTHH:mm:ssZ.
from here: http://momentjs.com/docs/#/displaying/format/
But if people want to use the UTC time, then it should be possible to ask moment to call toISOString() instead of format(). (which is my case, in our db / apps, all dates go as ISO-8601 UTC)
But currently, DatePicker shows "invalid date".
If I find some time, I can send a PR related to this issue?
from react-bootstrap-datetimepicker.
Related Issues (20)
- when viewMode is months, would like to select only month and year from picker. HOT 1
- How could I add custom class to hightlight some specific dates.
- Uncaught TypeError Occur when click to choose datetime
- Do I need webpack just for using this?
- ParentComponent.jsx:21 Uncaught TypeError: this.setState is not a function
- Installed Glyphicon but still getting errors related
- This repo should be deprecated, there is a better fork. HOT 3
- New dist build
- How to change orientation of the calendar from left to right side of the icon? By default its left.
- add disabled option HOT 2
- How to use extraFormats option available in the docs?
- can it support Chinese
- overflow: auto;
- Run the examples is error
- Add weekdaysShort to DateTimePickerDays
- Warning: Failed prop type: Invalid prop `dateTime` supplied to `DateTimeField`.
- onFocus, onBlur events not working
- Uncaught TypeError: Cannot read property 'func' of undefined HOT 8
- Date/Time UTC
- Using with Redux Form Name attribute not set
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-bootstrap-datetimepicker.