Demo with Datepicker

Datepickers are handled by javascript and css, so it is not that hard to implement in a miniform.

This demo uses the Air-Datepicker that offers the script and css through a CDN.
If you are not using a cdn the scripts should be loaded somewhere from your website.

The Air datepicker needs 2 scripts (one for the datepicker and one for the localization) and one css file included.
You can include them in your website template, but if you are not to concerned about using css links within your output you can also include them in the miniform template.

When the script is included, it just needs to find an inputfield with the class "datepicker-here" to trigger the script.
To use English as language a field data-language="en" is needed.

More customisation can be found on the Air datepicker documentation website.

Thats all ;-)

 

Scripts included in this demo:

<link href="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/css/datepicker.min.css" rel="stylesheet" type="text/css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/datepicker.min.js"></script>
<!-- Include English language -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/i18n/datepicker.en.min.js"></script>

 

Demo form

Items marked with * are required

 

If you want to test this demo, just download the template and add it to your miniform templates folder.

Download

form_date-demo.zip

Demo form with datepicker
License: GNU / GPL
Timestamp: 30-11-2017
Version: 1.0
Filesize: 1,022.00 B
Downloads: 893