Задать вопрос
drno-reg
@drno-reg
см не кратко
javascript

Как правильно отключить отображение секунд, миллисекунд в Timepicker to jQuery UI Datepicker?

Здравствуйте.

для решения задачи по выбору даты и времени решил попытаться воспользоваться
Timepicker to jQuery UI Datepicker.

Подключил таким образом

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
    <script src="../js/jquery-2.0.0.js"></script>
    <link rel="stylesheet" href="../css/normalize.css">
    <link rel="stylesheet" href="../css/bootstrap-cosmo.min.css">
    <script src="../libs/bootstrap.js"></script>

    <link rel="stylesheet" href="../css/font-awesome.min.css">
    <script type="text/javascript" src="../js/bootstrap-select.min.js"></script>
    <link rel="stylesheet" href="../css/bootstrap-select.min.css" />
    <link rel="stylesheet" href="../css/jquery-ui.css" />
    <script src="../js/jquery-ui.js"></script>

    <link rel="stylesheet" href="../css/themes/base/jquery-ui.css">
    <script type="text/javascript" src="../js/jquery-ui-timepicker-addon.js"></script>
    <script type="text/javascript" src="../js/jquery-ui-sliderAccess.js"></script>

<script>
$(function(){
//    $('#date_begin,#date_end').datetimepicker();

    $.datepicker.regional['ru'] = {
        closeText: 'Закрыть',
        prevText: '<Пред',
        nextText: 'След>',
        currentText: 'Сегодня',
        monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
        monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн','Июл','Авг','Сен','Окт','Ноя','Дек'],
        dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
        dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
        dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
        weekHeader: 'Не',
        dateFormat: 'dd.mm.yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
    $.datepicker.setDefaults($.datepicker.regional['ru']);


    $.timepicker.regional['ru'] = {
        timeOnlyTitle: 'Выберите время',
        timeText: 'Время',
        hourText: 'Часы',
        minuteText: 'Минуты',
        secondText: 'Секунды',
        millisecText: 'Миллисекунды',
        microsecText: 'Микросекунды',
        timezoneText: 'Часовой пояс',
        currentText: 'Сейчас',
        closeText: 'Закрыть',
        timeFormat: 'HH:mm',
        amNames: ['AM', 'A'],
        pmNames: ['PM', 'P'],
        isRTL: false
    };
    $.timepicker.setDefaults($.timepicker.regional['ru']);

    $('#datetime_from').datetimepicker(
//        $.timepicker.regional['ru'],
        {
//            minDate: getFormattedDate(new Date()),
            showSecond:false,
            showMillisec:false,
            showMicrosec:false,
            showTimezone:false,
            stepHour: 2,
            stepMinute: 10,
            stepSecond: 10,
            showTimePicker: false
        }
    );
});
</script>

    <div class="container">

        <div class="row text-center">

            <span>С</span>
            <input type="text" id="datetime_from">

            <span>По</span>
            <input type="text" id="datetime_to">

        </div>
 </div>


патыюсь при создании страницы опцией отключить секунды и т.д.

$('#datetime_from').datetimepicker(
//        $.timepicker.regional['ru'],
        {
//            minDate: getFormattedDate(new Date()),
            showSecond:false,
            showMillisec:false,
            showMicrosec:false,
            showTimezone:false,
            stepHour: 2,
            stepMinute: 10,
            stepSecond: 10,
            showTimePicker: false
        }
    );


но на опции showSecond:false реакции нет...

Как правильно отключить отображение секунд, миллисекунд?
  • Вопрос задан
  • 661 просмотр
4 комментария
Подписаться 1 Оценить 4 комментария
Решения вопроса 1
drno-reg
@drno-reg Автор вопроса
см не кратко
такого результата
2ff5e2b3608c4bf2a8661fc56852d2a9.png
возможно добиться этим css

<style type="text/css">
        .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
        .ui-timepicker-div dl { text-align: left; }
        .ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
        .ui-timepicker-div dl dd { margin: 0 10px 10px 40%; }
        .ui-timepicker-div td { font-size: 90%; }
        .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
        .ui-timepicker-div .ui_tpicker_unit_hide{ display: none; }

        .ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; }
        .ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; }

        .ui-timepicker-rtl{ direction: rtl; }
        .ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
        .ui-timepicker-rtl dl dt{ float: right; clear: right; }
        .ui-timepicker-rtl dl dd { margin: 0 40% 10px 10px; }

        /* Shortened version style */
        .ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; }
        .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time,
        .ui-timepicker-div.ui-timepicker-oneLine dt { display: none; }
        .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; }
        .ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; }
        .ui-timepicker-div.ui-timepicker-oneLine dl dd,
        .ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; }
        .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
        .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; }
        .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
        .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; }
        .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
        .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; }
    </style>
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Бэкэнд-разработчик JavaScript
Wanted. • Москва
от 250 000 до 400 000 ₽
Senior Frontend (JavaScript) разработчик
Vital Partners LLC
от 350 000 до 420 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Плагин на Java для TeamCity с поддержкой Fossil SCM
29 янв. 2025, в 12:04
3000 руб./в час
Работа с продвижением на YouTube. Только профи
03 февр. 2025, в 13:44
200000 руб./за проект
Разработать дизайн сайта и сам сайт на Webflow
03 февр. 2025, в 13:23
150000 руб./за проект
Ещё заказы