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>