Good day to everyone.
I need to validate a non-existing date with moment taking the value from a datepicker, so far I couldn't do it. For example:
moment('29/02/2021').isValid()
will return true as the format is correct but the date as is does not exist... The point with this is to show to the user an error message whenever the value passed to the datepicker is an invalid date or whatever else that is not a date (123456789 or asd for example)
Thank you for your help in advance
The answer was pretty simple in the end. Adding the 'L' parameter to the moment date constructor was enough to check if the incoming date exists or not.
Now if you do moment('29/02/2021', 'L').isValid() will return false instead of true, this also checks for the user's locale and will apply the corresponding format.
Related
I use Redux Form and react-datepicker
It works very nice, and I would like to get it work ideally according to my needs.
I need to show the date in localized format (let's say DD/MM/YYYY), and in the same time save value attribute of the input in static format ("YYYY-MM-DD").
I could add a hidden input with such value format, but if it's possible to avoid it using datepicker customization, it would be great!
Thanks for your advice in advance.
UPD:
Take a look on screenshots:
This is how it works now (nothing has to be changed here).
And value is synchronized with the locale. I want to keep the locale to present my date in the locale format for the user, and keep the format unchanged ("YYYY-MM-DD" forever) for the back end.
Here is the link to codesandbox.
You can use state and moment.js package to have date in several formats.
EDIT: the key thing is redux form. Datepicker is just view that can show exactly what you need. So, what you can do is: change redux form field value (or what you are using) and just have another state field (let's say 'dateForDatepicker') which value you'll pass to datepicker.
GOOD SOLUTION: https://stackoverflow.com/a/42726079/7479959
I am trying to display initial values on my redux form when it first load. Every fields work except the date input field. I tried to use moment to format string (YYYYMMDD) to MM/DD/YYYY and it's not working. No matter how I formatted, the field fail to display and instead showing the default place holder character mm/dd/yyyy until I selected a date. I am using the default redux-form input component date type. How should I do this right? Appreciate for any help.
When you are setting the initial date in your state, you need to provide it as per ISO-8601 standards, so YYYY-MM-DD, i.e. 2018-08-22 for 22nd August 2018.
I have never used redux-form library before, but I found a codesandbox example in their guide, and managed to get it to work here by just relying on them having followed the ISO standard. Feel free to play around with it.
I'm trying to implement a feature for a form where:
1. I display a date string in the format mm-dd-yyyy
2. User is allowed to edit the form, and the date string would remain in the format mm-dd-yyyy
3. When the user submits the form, the date string must be in the format yyyy-mm-dd.
3. The original format of the date string is yyyy-mm-dd.
I would prefer to achieve this somehow by means of a directive rather than calling a function everytime a user submits a form, was wondering if there were any thoughts on a good way to do this?
I've given angular-ui-mask a look but am not sure if this would help me so much for this case.
Thanks!
I have an input element on my form that accepts a date/time. It has validation to check that it's a valid date/time. The default value for the field is the current date and time. When using Chrome, I can change the value of this input box multiple times, and as long as it is a valid date and time it will be accepted. However, in IE 11, if I change it to another valid date/time, it indicates an invalid value and will not allow the form to save.
The date/time field:
input#transit_date_arrived.form-control.date-time-picker(name='transit_date_arrived', ng-model='vehicle.transit_date_arrived', type='datetime')
In the vehicle model:
transit_date_arrived: {
type: sequelize.DATE,
allowNull: true,
validate: {
isDate: true
}
},
If anyone knows how to get this to work with Internet Explorer, I would really appreciate it, thanks!
One problem with IE and angularJS (in fact, maybe more than just a.JS) is that a field marked as invalid also spontaneously becomes "dirty" when typed in, tabbed through or otherwise interacted with. Apparently this also applies when validation resets the field, and on the second interaction the same happens.
According to a few questions and a bit of research, validation is actually very broken in IE. At this link, for example, determination between literal empty strings and invalid strings in impossible.
This link shows some issues that the author has come across in actual date verification, including error handling and false-date resolution. Unfortunately, his code has broken the definition for a "true" date - i.e. 0000.00.00 would be recognised as a valid date, due only to it's formatting.
There is an example of date verification here, which you may wish to use to append your code. in particular, you may wish to use $valid and $error.required.
There's also a very ugly piece of code here, which intends to allow validation in 4-step form.
I have problem with richfaces calendar. I want to see only year and month so i made datePattern="yyyy/MM", which works fine until i want to change date.
When i click on button and calendar pop up the current value disappear. If i don't select date the value is null. I tried to save old date in my bean but problem remains because when i open calendar it is always set to todays date.
Problem occur only when i don't put dd(days) in datePatern
<rich:calendar value="#{myBean.date}" datePatern="yyyy/MM" />
Tnx for help in advance
I got answer on richfaces forum so i will copy it also here
I guess rich:calendar is not the right choice at you case although rich:calendar may be bound to probably any object type provided that you supply custom converter a day ordinal still should be supplied because it's a part of the date maybe you would do better with a h:selectOneMenu to specify a month and a h:inputText to define a year instead of "incomplete" rich:calendar