Home  ›  AJAX Form Pro: + Admin Panel & Database  ›  How to Add Datepickers to Fields

How to Add Datepickers to Fields

Date pickers are useful if you have fields where dates should be filled in. They are supported (obviously) only in the INPUT text field types.

If you wish to enable it for a specific field, go to the field’s page:

1) Go to “Manage Forms” and select the form you want.
2) Click on the “Fields” link, then click “Edit” on the INPUT field where you wish to add the date picker to.

Close the modal box and click “Preview Form” to see the field with the date picker in action.

What if I have 2 fields in a form that need to depend one from another?

You can have fields such as “Coming date” and “Leaving Date”, “Check-In Date” and “Check-Out Date”. If you select 1st of March as the “Check-In Date” you might want to have the past dates (prior to 1st of March) disabled from the “Check-Out Date”.

In this case you should add the “class” attribute with the following values:
– “datepicker check_in_out_from” (for Check-In Date)
– “datepicker check_in_out_to” (for Check-Out Date)

The first value, “datepicker” triggers the JS Datepicker where you can select the date, while the second one determines whether it is a “from” or “to” date. “check_in_out” is actually a unique prefix for these 2 fields: (“Check-In Date” and “Check-Out Date”) to prevent any conflict in case other datepicker fields are present in the form.
You might want to add a second group of datepickers with range to the same form. In this case you should use the same settings as shown above while using a different prefix (e.g. date_from, date_to). Don’t forget to put one underscore sign between the prefix and “from” or “to”.

What if I want to change the language of the Date Picker as well as other settings such as the Date Format?

[Click here to view the short steps that need to be done in order to accomplish this!]

2 Responses to “How to Add Datepickers to Fields”

  1. Christian says:

    I’m making a hotel reservation form, such as restricting the entry of the date the form, for dates before the current date. (For example, today is June 15 and should be off all the dates before the current date as 14,13,12,…….). In other words, validate input only dates after the current date. I am using http://translate.google.com/.

  2. Luc Brusten says:

    I would like to know this as well.

Leave a Reply

Help us improve the wiki Send Your Comments

Optimization WordPress Plugins & Solutions by W3 EDGE