Date Picker and Time Range

Hello,

We have checked out your Website and the issue appears to be with the Datepicker JS Initialization. You will need to change the JS Initializations according to your Codes:

1. Find the following code on your Page:

and replace it with:

1. Find the following JS Code:

$('.travel-date-group .default').datepicker

and replace it with:

$('.date-picker').datepicker

This will definitely fix your issue. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Hello,

1. You can simply add the format: "dd-mm-yyyy" Setting in the JS Datepicker Function.

2. For using the TimePicker, you will need to use a Different Field with the following function:

$('.datetimepicker').datetimepicker({
	showClose: true
});

You can check out the component-datepicker.html Template for the TimePicker Field. Additionally, also make sure that you only have those JS Functions which you are using on the Page so that you do not get confused.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Hello,

Thanks for your Patience!

1. Please use the following code:

$('.date-picker').datepicker({
	autoclose: true,
	format: "dd-mm-yyyy",
});

For complete set of Options for this Date Picker, you can check this Documentation: http://bootstrap-datepicker.readthedocs.io/en/latest/options.html .

1. For the Second Date/Time Picker, use the following code:

$('.datetimepicker').datetimepicker({
	showClose: true,
	disabledHours: [0,1,2,3,4,5,6,7,8,22,23]
});

Note that these are two different plugins, so you will need to use different JS Initialization codes for both of these pickers.

For complete set of Options for the Date/Time Picker, you can check this Documentation: https://eonasdan.github.io/bootstrap-datetimepicker/Options/ .

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.