Reputation: 525

how to allow date in "dd/mm/yyyy" inside an input text field in reactjs?

Working on a sample reactjs form. It has two date fields, startdate and enddate as shown below

<input type="text" name="startdate" value={this.state.startDate}/>
<input type="text" name="enddate" value={this.state.endDate}/>

these two fields should allow date, only in "dd/mm/yyyy" format and should not allow any other characters expect valid date, month, year and "/".

How to allow only the valid characters as mentioned above using javascript?

Upvotes: 1

Answers (3)

Reputation: 56

In case if anyone using redux and redux-form, there is a mechanism Field Normalizing Check out details at redux-form

Upvotes: 0

Reputation: 11693

If working only on a text field, use momentJS to parse the field content and assert the format.

There is node-dateformat too (I never tried this last one).

A second approach would be to use a datepicker like:

a react component already embedding the date format, like react-input-calendar or react-bootstrap-date-picker.
jquery datepicker

Upvotes: 1

Reputation: 176

You can add onchange on input field and use the preg_match from this link

Upvotes: 0