Then attach a date range picker to whatever you want to trigger it:
<input type="text" name="daterange" value="01/01/2018 - 01/15/2018" class="form-control" />
RESULT
If you want to book a one-day calendar, use this and custom JS.
RESULT
CDN #
Use the JavaScript CDN to include the necessary resources for the UX4G Date and Time.
| Description |
URL |
| CSS |
https://img1.digitallocker.gov.in/ux4g/UX4G@2.0/css/ux4g-date-time.css |
| JS |
https://img1.digitallocker.gov.in/ux4g/UX4G@2.0/js/ux4g-date-time-1.js
https://img1.digitallocker.gov.in/ux4g/UX4G@2.0/js/ux4g-date-time-2.js |
For date range
$(function() {
$('input[name="daterange"]').daterangepicker({
opens: 'left'
});
});
For single date range
$(function() {
$('input[name="singleDate"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1901,
maxYear: parseInt(moment().format('YYYY'),10)
});
});
Government of
India
