jQuery – Adding a Timepicker to jQuery UI Datepicker
Link
Example
<link rel="stylesheet" href="assets/jquery-ui/jquery-ui.min.css"/>
<link rel="stylesheet" href="assets/css/jquery-ui-timepicker-addon.min.css"/>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/jquery-ui/jquery-ui.min.js"></script>
<script src="assets/js/jquery-ui-timepicker-addon.min.js"></script>
<form id="test">
<input type="text" id="datum" name="datum">
</form>
<script>
$(function () {
$.datepicker.regional['cs'] = {
closeText: 'Zavřít',
prevText: 'Předchozí',
nextText: 'Další',
currentText: 'Dnes',
monthNames: ['Leden', 'Únor', 'Březen', 'Duben', 'Květen', 'Červen', 'Červenec', 'Srpen', 'Září', 'Říjen', 'Listopad', 'Prosinec'],
monthNamesShort: ['Led', 'Úno', 'Bře', 'Dub', 'Kvě', 'Čer', 'Čvn', 'Srp', 'Zář', 'Říj', 'Lis', 'Pro'],
dayNames: ['Neděle', 'Pondělí', 'Úterý', 'Středa', 'Čtvrtek', 'Pátek', 'Sobota'],
dayNamesShort: ['Ne', 'Po', 'Út', 'St', 'Čt', 'Pá', 'So',],
dayNamesMin: ['Ne', 'Po', 'Út', 'St', 'Čt', 'Pá', 'So'],
weekHeader: 'Sm',
dateFormat: 'D, dd.mm.yy',
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: '',
showButtonPanel: true,
changeMonth: false,
changeYear: false,
showOn: "button",
buttonImage: "images/calendar.gif",
buttonImageOnly: true,
buttonText: ""
};
$.datepicker.setDefaults($.datepicker.regional['cs']);
$.timepicker.regional[‚cs‘] = {
timeOnlyTitle: ‚Vyberte čas‘,
timeText: ‚Čas:‘,
hourText: ‚Hodiny‘,
minuteText: ‚Minuty‘,
secondText: ‚Sekundy‘,
millisecText: ‚Milisekundy‘,
timezoneText: ‚Časová zóna‘,
currentText: ‚Dnes’,
closeText: ‚Zavřít‘,
timeFormat: ‚HH:mm‘,
amNames: [‚AM‘, ‚A‘],
pmNames: [‚PM‘, ‚P‘],
isRTL: false,
timeInput: true,
showTimepicker: true,
controlType: ‚select‘,
oneLine: true,
};
$.timepicker.setDefaults($.timepicker.regional[‚cs‘]);
$(„#datum“).datetimepicker();
});
</script>