<!-- HTML -->
<input type="text" class="form-control f-basic flatpickr-input" placeholder="Select Date.." readonly="readonly">

<!-- JavaScript -->
<script >
	$(".f-basic").flatpickr({
		enableTime: true,
		dateFormat: "Y-m-d H:i",
	});
</script>

flatpickr without any config

Human-friendly Dates

altInput hides your original input and creates a new one.

Upon date selection, the original input will contain a Y-m-d... string, while the altInput will display the date in a more legible, customizable format.

Enabling this option is highly recommended.

flatpickr without any config

Disabling dates

If you’d like to make certain dates unavailable for selection, there are multiple methods of doing so.

• Disabling specific date
• Disabling a date range
• Disabling dates using a function

All of those are possible with the disable option

flatpickr without any config