Form date validation in a form - javascript

I have a form with 2 fields, in one of theme the user will enter a date in the format dd/mm/yyyy and in the other the user will enter a time in the format hh:mm
How can I force this fields formats and how can I validate the date field in order to make sure the date entered is valid and its bigger then the current date and the time field in order to make sure it's a valid time.
I'm using JavaScript in this web site.

For dd/mm/yyyy use
< input type=date>
For hh:mm:
< input type="time">
Set a processing function on form's onsubmit field. In that function you can get a value of dates ( with help of document.getElementBy* functions ) and compare them with DateTime object( use default constructor to get current date).

Related

How to validate wanted date time format using javascript?

I am using javascript Date.parse to validate if a date string is a valid date time. I have a specific date time input like this: '8/21/2022 1:45: -04:00' when I do Date.parse('8/21/2022 1:45: -04:00'), the seconds part after : is empty, will get a number which means this date format is correct. I also tried using moment.js v2.29.2 moment('8/21/2022 1:45: -04:00').isValid(), will also get true. Just wondering if anyway to make '8/21/2022 1:45: -04:00' format to invalid? Thank you so much

Problem: Date input onchange running function on number keys input

I have 2 date fields; end_date and to_date. When end_date is set to before to_date it changes to_date to the value of end_date.
The problem I'm having is if the user types in the date field rather than using the calendar picker, it accepts each of the keypresses as a valid date.
For example: Both end_date and to_date = 18/10/2022
The user wants to change end_date to a later date (ex 20/11/2022), so in theory it should not change to_date.
When the user then goes to type 20 the date field will run the function with the date 02/10/2022, thus changing to_date (because typing "2" will change the date to 02).
The only solution I have right now is just making it impossible for the user to use number keys in the field, however this is not optimal. Does anyone have a better solution?

Angular date and time validation MM/DD/YYY HH24MI

I am receiving a date and time format as a string like this 'MM/DD/YYY HH24MI' e.g 10/02/2010 0730
I am displaying the data in an input field using angular material. I want to validate user's input to match this format to make sure they didn't enter something different. Tried datetime-local but that didn't display it as the format mentioned above.
Thanks in advance.

Searching in input gives incorrect date in material date picker need to convert it into UTC

I am extending MomentDateAdapter for my requirement. When i am selecting a date from the calendar i am getting the correct output but when i manually type something in the input field i get wrong output.
For the selected date i am using _moment.utc({ year, month, date }).locale(navigator.language); to convert the selected value to UTC format but i am not sure on how to do the same when user searches in the input field.
StackBlitz.
to reproduce:
Try to select a value from calendar and see the console (notice the date is converted to UTC)
Now try to add a date manually by typing in and see the console (date is not converted to UTC).
You need to adapt your parse method call of moment to:
return moment.utc(value, parseFormat, this.locale, true);
to get utc Date from your input.
Here is your adapted Stackblitz.
The methods format and createDate are called if you set your date via picker, the parse method is called if you set it via input.

PDF Form Date Calculations and Restrictions?

I have made a PDF Form, I still have the following tasks to be done, any help will be useful:
Date Picker: Is there any Hijri/Gerogian Datepicker known to work on PDF Forms.
Date Compare: I have to date fields, want to validate the the end date field to be equal or more than the start date.
Calculate Date: Want to calculate the number of days between two dates.

Categories