jQuery datepicker date and time
HTML
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.4.5/jquery-ui-timepicker-addon.js"></script>
<p>Datum: <input type="text" name="datumtijd-aanduiding" id="datumtijd-aanduiding" value=""/> Om: <input type="text" name="datumtijd-aanduiding-tijd" id="datumtijd-aanduiding-tijd" value=""/></p>
JavaScript
$( document ).ready(function() {
$("#datumtijd-aanduiding").datepicker({
dateFormat: "DD, d MM yy : m",
onSelect: function (dateText, instance) {
$('#datumtijd-aanduiding').text(this.value);
var date = $.datepicker.parseDate("DD, d MM yy", dateText);
var isWeekendHours = !$.datepicker.noWeekends(date)[0];
if (isWeekendHours) {
$("#datumtijd-aanduiding-tijd").removeClass("hasDatepicker");
$("#datumtijd-aanduiding-tijd").timepicker({
hourMin: 12,
hourMax: 17,
stepMinute: 5,
timeOnly: true,
timeFormat: "HH:mm"
});
} else {
$("#datumtijd-aanduiding-tijd").removeClass("hasDatepicker");
$("#datumtijd-aanduiding-tijd").timepicker({
hourMin: 8,
hourMax: 22,
stepMinute: 5,
timeOnly: true,
timeFormat: "HH:mm"
});
}
},
//set options
minDate: 0,
numberOfMonths: 1,
showButtonPanel: true,
changeMonth: true,
changeYear: false,
selectWeek: true
}).datepicker("setDate", "0");
});