Wanted to enforce mm/dd/yyyy date format

i have one text input field where date need to be entered in mm/dd/yyyy format and should generate error if I enter date in any other format upon clicking submit button, but failed to do that with regex. Even When i entered date in mm/dd/yy format, its still submitting the form.

<html>
<form method ="post" action = "a.php">
<div class="row"> <div class="col-lg-4"> <div class="form-group">
		<label>Date of Registration :</label><input type="date"    pattern="(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))"  name="dateq" id="dateq" class="form-control" Required>
		</div> </div> </div>
<input type = submit value = submit>
</form>

can any expert guide whats wrong with it ???

So you’ve just… taken this pattern from somewhere else, I take it. Cause, that’s not even close to what you’ve stated you want. It doesn’t even include any /'s. So… let’s not pretend you’ve done that. :stuck_out_tongue:

i took the whole example from the website, i cannot share my original code due to data security. And I written no where that its my own code :slight_smile:

You are never going to be able to check whether, for example, 09/12/2023 is in mm/dd/yyyy format or dd/mm/yyyy format.

So use a <select> element in your form for the month: Jan, Feb etc.

However, as type=“date” brings up a date selector, that may be sufficient.

1 Like

currently i am using select element but it take time to select entire date

The reason type="date" exists is to make it so you don’t have to worry about the format of the date entry. The value entered is always presented in YYYY-MM-DD format in the code, and as the user’s local format for display.

The format used “on the wire”, i.e., in HTML markup and in form submissions, is intended to be computer-readable and consistent irrespective of the user’s locale. Dates, for instance, are always written in the format “YYYY-MM-DD”, as in “2003-02-01”. While some users might see this format, others might see it as “01.02.2003” or “February 1, 2003”.

The time, date, or number given by the page in the wire format is then translated to the user’s preferred presentation (based on user preferences or on the locale of the page itself), before being displayed to the user. Similarly, after the user inputs a time, date, or number using their preferred format, the user agent converts it back to the wire format before putting it in the DOM or submitting it.

If you want it to display in your specific format rather than adapt to the user’s local then you should use type="text" then you can use either JavaScript and/or the pattern attribute to restrict the format.

1 Like

ok got it but the problem is that when I define date type as “date” and when i entered date as mm/dd/yy then its storing it as as 00yy-mm-dd instead of yyyy-mm-yy

Cross-browser compatibility issues with type="date" have caused me to tie myself in knots in the past.

One solution that you might look into is using an input mask. This makes sure that user input conforms to what you desire. Here’s a basic demo (not mine):

This doesn’t prevent the user entering something like “99/99/9999”, but you could, for example, attach an onBlur handler to the field, then attempt to parse what the user has entered as a Date. If that fails, then you can inform the user that their input is invalid.

See also:

2 Likes

If you are using type="date", then your PHP script should be expecting the date to be in the YYYY-MM-DD format and process it accordingly. For example:

$dateq = DateTime::createFromFormat('Y-m-d!', $input);
if (!$dateq){
    //Handle invalid format.
    throw new \InvalidArgumentException();
}
2 Likes

this is the real crux of the idea. no matter what you do on the front end (including the idea that a date will always transmit yyyy-mm-dd for standardization and sortability…), the back end is where you actually need to check the data. Someone could skip your form and try and submit programmatically.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.