jQuery DateTimePicker pluginКак-то я описывал работу с jQueryUI datetimepicker. Приемлимым этот плагин назвать было сложно, потому как он тянул с собой весь jQueryUI, и еще 10-ок файлов. По функциональности он тоже весьма скуп. Ничего более стоящего, и тогда и сейчас найти не удалось. Поэтому написал свой плагин с преферансом и поэтессами.

Результатом трудов стал великолепный на мой взгляд плагин на jQuery DateTimePicker

Почему он лучше, чем стандартный jQuery UI виджет?

Во первых, потому, что не требует кроме себя и собственно jQuery ничего более. Во вторых в сжатом виде, весит менее 5кб вместе со стилями. Нет других дополнительных файлов с изображениями, только файл стилей и файл js.

Однако, главным преимуществом, я считаю, наличие отключаемого,  TimePicker'а. Да DatePicker тоже отключаем и это очень удобно.

То, что дает нам интернет, в этом сегменте виджетов, ужасно. Пикеры из 90-х. Такое ощущение, что их создателям было просто наплевать на внешний вид своего детища. Один из самых удачных, это безусловно jscal, но он настолько сложен и монструозен, что просто прикрутить его к тестовой странице мне не удалось. Да объем кода, ему сопутствующий оставляет желать лучшего.

У других хуже. Сплошные недочеты. То нет предустановок и каких-то опций, то и вовсе нет никаких настроек. Все вшито. Как говорится, используйте как есть, либо не используйте.

  

Я постарался учесть свой опыт, в работе с датой и временем. Также учел, что форматы времени могут отличаться для разных стран. 

То, что у меня получилось смотрите ниже.

Подключаем

<link rel="stylesheet" type="text/css" href="js/jquery.datetimepicker.css"/>
<script src="js/jquery.js"></script>
<script src="js/jquery.datetimepicker.js"></script>

Используем

Начнем с  демо, без опций

<input type="text" id="datetimepicker"/>
<script>
$('#datetimepicker').datetimepicker();
</script>

Результат

Но, что если в Вашей стране свой формат времени и язык. Плагин поддерживает интернацианализацию, и содержит 3 языка: английский, русский и немецкий вариант. Формат же, задается точно так же, как и в php.

Сделаем плагин на немецком языке. Оставим только datepicker, и поменяем формат даты. (пример с языком просто демонстрирует возможности интернационализации, так как плагин уже содержит немецкий язык, и достаточно было бы использовать лишь lang:'de')

$('#datetimepicker1').datetimepicker({
 lang:'de',
 i18n:{de:{
   months:[
       'Januar','Februar','März','April','Mai','Juni','Juli','August',
       'September','Oktober','November','Dezember',],
    dayOfWeek:["So.", "Mo", "Di", "Mi", "Do", "Fr", "Sa.",],
 }},
timepicker:false,
format:'d.m.Y',
});

Результат

Не всем нужен DatePicker. Что если мы выбираем только время. нет ничего проще, отключаем DatePicker

$('#datetimepicker2').datetimepicker({
	datepicker:false,
	format:'H:i',
});

Результат

Ну и еще один пример, когда DateTimePicker заменяет исходный input

$('#datetimepicker3').datetimepicker({
  format:'d.m.Y H:i',
  inline:true,
  lang:'ru',
});

Результат

 

Предположим, что мы нашли нужный нам рейс в определенный день. рейс идет несколько раз в день, но не через ровные интервалы времени. В этом нам поможет опция  allowTimes

$('#datetimepicker4').datetimepicker({
 datepicker:false,
 inline:true,
 allowTimes:['9:00','12:00','15:00','19:00','21:00'],
});

Результат

Перечислять все возможности плагина очень долго, поэтому приведу следующую таблицу.

 

Полный список опций

Название  default Назначение Пример использования
value null Задает текущее значение datetimepicker. Если оно задано, то input.value игнорируется
{value:12.03.2013,
 format:'d.m.Y',}
lang en Язык на котором отображаются дни недели и месяцы. В плагин встроены 3 языка: английский - en, немецкий - de и русский - ru
{lang:'ru'}
format Y/m/d H:i Основной формат времени. Используя этот параметр, плагин переводит дату указанную в value в свой формат, с которым в дальнейшем оперирует. Формат, идентичен тому, который использует php в функции date. Полный список можно посмотреть в документации 

 

{format:'H'} // отображаем только часы
{format:'Y'} // год 
formatDate Y/m/d Это служебный формат даты. Используется для того, чтобы плагин верно интерпретировал значения опций  minDate и maxDate, о которых будет написано ниже  
{formatDate:'d.m.Y'} 
formatTime H:i  Аналогично formatDate . Используется для того, чтобы плагин верно интерпретировал значения опций  minTime и maxTime, о которых будет написано ниже   
{formatTime:'H'} // только час
step 60 В TimePicker'е список вариантов выбора времени выводится с определенным интервалом в минутах. По умолчанию - это 1 час (60 минут).
{step:5}
closeOnDateSelect 0

Если отображаются и DatePicker и TimePicker то, при выборе даты плагин не закрывается. Делает он это, только после выбора времени.

Если задано true, то плагин будет закрыт при выборе даты. Если false, то даже если timepicker не отображается, плагин закрыт не будет.

{ closeOnDateSelect:true}
closeOnWithoutClick true Закрывать плагин если пользователь не выбрав дату, кликнул где-то вне плагина.
{ closeOnWithoutClick :false}
timepicker true Отображать TimePicker. Может принимать false, только если  datepicker== true

 

{timepicker:false}

 

datepicker true  Отображать DatePicker. Может принимать false, только если  timepicker== true 
{datepicker:false}
minDate false Опция, предназначенная для ограничения нижней границы выбора даты. К примеру, вы заказываете такси, и Вам необходимо выбрать дату. Очевидно, что дату можно выбирать только начиная с текущего дня. Если задать, как 0, то будет использована текущая дата.
{minDate:0,} // текущая дата
{minDate:'2013/12/03'}
{minDate:'05.12.2013',formatDate:'d.m.Y'}
maxDate false Аналогично  minDate, верхняя граница даты. 0 - текущая дата
{maxDate:0,} // текущая дата
{maxDate:'2013/12/03'}
{maxDate:'05.12.2013',formatDate:'d.m.Y'}
minTime false Аналогично minDate, но для TimePicker'a
{minTime:0,} // текущая дата
{minTime:'12:00'}
{minTime:'13:45:34',formatTime:'H:i:s'}
maxTime false  Аналогично maxDate, но для TimePicker'а
{maxTime:0,} // текущая дата
{maxTime:'12:00'}
{maxTime:'13:45:34',formatTime:'H:i:s'}
allowTimes [] Опция, которая задает доступное для выбора время. К примеру, выбор автобусного рейса может быть только в определенное время. При этом значения   minTime и  maxTime игнорируются.
{allowTimes:[
'09:00','11:00','12:00','21:00'
]}
opened false При true плагин будет открыт сразу после загрузки страницы  
inline false При true плагин заменяет собой <input>  
onSelectDate function(){} Вызывается при выборе даты в DatePicker'е. Имеет 3 параметра. Сам плагин, текущее время, с которым плагин работает и ссылка на элемент input
onSelectDate:function($dtp,current,input){
  alert(current.dateFormat('d/m/Y'))
},
onSelectTime function(){} Аналогично onSelectDate  для TimePicker  
onChangeMonth false Вызывается при смене месяца в DatePicker  
onChangeTime false При прокрутке времени  
onShow false При показе плагина  
onClose false Перед закрытием плагина  
withoutCopyright false Опция, для отключения пока ссылки на сайт плагина  
inverseButton false Инвертирует прокрутку  
hours12 false 12-ти часовой формат времени  
dayOfWeekStart 0

Начало недели в DatePicker. По умолчанию с Воскресения - 0.

Понедельник - 1

Вторник - 2

Среда - 3

...

Суббота - 6

 

 

Оставлять комментарии могут только зарегистрированные пользователи

Комментарии  

Amoseven
# Amoseven 09.12.2013 10:29
Замечательный плагин. Спасибо.

Есть маленький вопрос. При инициализации значение даты в поле правильное, какое задали, но при выборе в календаре всё равно устанавливает текущую дату. Хотелось бы, чтобы календарь позиционировался на значении которое я передал input.value
Leroy
# Leroy 09.12.2013 14:17
быть может не совпадает формат времени? потому что в двух примерах выше так и есть, время задано другое и плагин переходит на него. к примеру в одном 12.11.2013 и плагин переходит на эту дату, и другой со временем 23:16, плагин переходит к 23:00, так как там step 60 минут
Эдуард
# Эдуард 11.06.2014 18:50
Плагин очень интересный. Спасибо.

Есть ньюансы в поведении (при inline:false)

1) При клике вне всплывшего календаря, он закрывается, но его значение (текущее дата/время) всё равно влетает в поле ввода, хотя более правильным поведением является оставить поле ввода по-прежнему пустым.

2) При закрытии формы, из поля ввода которой всплывал календарь, календар остаётся висеть, а не закрывается вместе с "родительской" формой.

Всё это конечно можно исправить наколдовав дополнительный код, но уж если есть плагин, было бы разумнее/удобнее, если бы это решалось самим плагином.
Алексей
# Алексей 18.06.2014 01:17
Валерий, спасибо за плагин!

Единственная просьба - сделайте для таймпикера возможность выбора минут (дополнительную ленту с минутами). В том проекте, где плагин сейчас использую я - это не нужно, но в дальнейшей перспективе было бы необходимо редактировать и минуты тоже. Более того, некоторым, возможно, потребуются и секунды. на мой взгляд, после той работы, что Вы уже проделали - это мелочь, но тем не менее.

Еще раз спасибо :-)
Boris Loboda
# Boris Loboda 06.08.2014 03:49
А какой минимальный год берет DateTimePicker? Есть необходимость фиксировать исторические события, скажем с 1500 года.
Leroy
# Leroy 06.08.2014 14:01
В спецификации http://ecma-international.org/ecma-262/5.1/#sec-15.9.1.1 сказано, что минимальная дата для js это 01 January, 1970. Плагин использует стандартные средства для работы с датами, поэтому такой возможности нет, но я подумаю что можно сделать
Boris Loboda
# Boris Loboda 06.08.2014 17:36
Вроде видел где-то что Класс DateTime в php поддерживает обработку дат то-ли с 1000-го года... Не могу найти. Хотя это ж надо наверное js...

В принципе объективная необходимость - фиксация в базе событий далекой давности.

Спасибо!
Boris Loboda
# Boris Loboda 06.08.2014 04:05
DateTimePicker:

При mask: true если выделить дату в поле ввода и нажать <Del> (очистка даты) только первая цифра в дате очищается. Должно быть типа такое "__.__.____", а получается такое "_5.08.2014", дата остается.
Leroy
# Leroy 06.08.2014 14:03
да, выделение пока не учитывается. В новой версии постараюсь этот момент пофиксить
Boris Loboda
# Boris Loboda 06.08.2014 17:56
И раз уж есть кнопочка "Номе", может стоит добавить "Clear"? В принципе очистка даты почти такая же востребованная операция как и установка даты. А то я уже думал добавлять рядом с полем ввода...

А если смотреть дальше - мое imho конечно...

В интерфейсном плане по-моему за полем ввода стоит добавить пару иконок - popup календаря и очистку для. Поле ввода в принципе выглядит как обычный <input> и для пользователя не очевидно, что это некий "интеллектуальный" элемент с выпрыгивающим календарем. Календарь конечно же выпрыгивает когда попадаешь в поле ввода, но для людей которые впервые с этим сталкиваются - это становится сюрпризом. А с кнопочками будет сразу видно и понятно, что это элемент с некоей обвязкой, он может нечто большее, чем просто принять текст.

В принципе инет-аудитория - это обычно случайные, разовые посетители... для них бы поменьше сюрпризов.
Leroy
# Leroy 06.08.2014 18:20
кнопка clear появится в следующей версии. А по поводу кнопок тригеров, то в плагине есть методы которыми можно пользоваться используя свои кнопки. В демо странице есть пример. Делать плагином такие кнопки это лишняя верстка, которая будет работать везде по разному, и не факт, что впишется в любой интерфейс. К примеру у бутсрапа есть сниппеты для создания таких кнопок на инпуте, и проще всего привязать триггер к ним. Хотя как опцию такую штуку может и добавлю
Boris Loboda
# Boris Loboda 06.08.2014 19:23
С версткой это да - могут быть казусы. Но для таких случаев в доке можно оговаривать условия. Типа дать например в css div со своим стилем и сказать - что типа "если вы поле используете с кнопками оно обязано быть в div того стиля которого я предлагаю".

Согласен, что в принципе такой симбиоз и самому нетрудно сделать.

Кстати насчет казусов с версткой -

http://www.dynarch.com/jscal/

На страничке jcal календарь от поля ввода (при нажатии кнопки) выпрыгивает аж на самый верх страницы. Или я чего не понял и такова была авторская задумка... :)
Boris Loboda
# Boris Loboda 06.08.2014 18:12
И еще одна тонкость с пустой (неустановленной) датой... Хотя я может чего не дочитал, не досмотрел.

После "посещения" поля даты (если оно изначально было пустое) - поле насильно заполняется текущей датой. Это не совсем правильно, пустая дата такое же валидное значение (в определенных ситуациях) как и явная дата, им тоже оперируют и используют этот факт. Например дата события неизвестна, событие еще не произошло. Типа - выписали заказчику накладную на товар заблаговременно, но заказчик товар еще не забирал - поле "Дата выдачи товара" должно оставаться пустым. Придет забирать - туда поставят конкретную дату в уже готовую накладную.
Leroy
# Leroy 06.08.2014 18:17
это было в старых версиях (надо обновить на сайте). Но и в них путем комбинации настроек оно отключалось. сейчас такое поведение по дефолту
Boris Loboda
# Boris Loboda 06.08.2014 19:09
Не совсем понял что делать, чтобы решить проблему (в смысле нормально оперировать пустой датой). Какое-то свойство переключить? Ждать новую версию? Или у меня старая версия (где именно взять новее)?
Leroy
# Leroy 06.08.2014 20:17
новую сказать на гитхабе, ссылка наверху.
Boris Loboda
# Boris Loboda 07.08.2014 08:13
v2.3.4 ставит дату при выходе из поля (клик вне календаря). Делать ничего не надо специально?

В коде посмотрел - есть allowBlank:true - я так понял это оно.

У меня с маской (ru-format), без маски не проверял пока. Положить может пример? - у меня сайт есть.

jQuery('#date_time').datetimepicker(

{

lang: 'en',

timepicker: false,

format: 'd.m.Y',

formatDate: 'd.m.Y',

minDate: '01.01.1000',

mask: true,

closeOnDateSelect:true

});
Leroy
# Leroy 07.08.2014 11:09
кроме mask и allowBlank, есть еще validateonBlur.
Leroy
# Leroy 07.08.2014 11:10
http://xdsoft.net/jqplugins/datetimepicker/#validateOnBlur
Boris Loboda
# Boris Loboda 07.08.2014 20:12
Да, с этим "каменный цветок" выходит...
Leroy
# Leroy 09.08.2014 01:05
подробнее?)
Boris Loboda
# Boris Loboda 10.08.2014 17:16
В смысле validateonBlur=false - дату насильно не ставит, когда уходишь из поля.

В общем - диапазон дат бы расширить на несколько столетий назад. :)
Boris Loboda
# Boris Loboda 07.08.2014 08:16
Из-за маски ставит - без маски уход нормальный.
илья1990
# илья1990 06.08.2018 13:35
а как сделать зависимые датапикеры? чтобы при выборе даты в первом, во втором это становилось максДата и также при выборе во втором в первом ставилась минДата.
Jaloliddin
# Jaloliddin 18.03.2015 21:06
Большое спасибо) выручили ) кстати это тоже напишите "closeOnTimeSelect:true," чтобы закрывался поле после того как только выбрано время. Спасибо Автору ещё раз))
overhedge
# overhedge 23.03.2015 20:25
Спасибо за плагин! Подскажите, пожалуйста, возможно ли прописать условие minTime "внутри" minDate, т.е. по дефолту для выбора закрыты дата и время меньше текущих (minDate:0,minTime:0), но при этом при выборе даты в будущем снова становятся доступны все слоты. Нужно для планирования визитов
overhedge
# overhedge 23.03.2015 22:06
Сам нашёл решение этой проблемы: http://xdsoft.net/jqplugins/datetimepicker/#comment-1856389675
Александр
# Александр 10.04.2015 08:27
Плагин очень понравился, во всяком случае, лучшего я не нашел. Но у меня возник вопрос (поскольку я очень неопытный программист) к его использованию.
Мне хотелось бы вместо значения id в селекторе использовать переменную, имеющую тоже значение.
Например,
$('#datetimepicker').datetimepicker({
вместо #datetimepicker хочу подставить var x = #datetimepickeк
Если не трудно, подскажите, как это сделать.
Заранее благодарю.
Leroy
# Leroy 10.04.2015 09:22
var x = '#datetimepicker'
$(x).datetimepicker();
:-)
Михаил
# Михаил 26.05.2015 12:05
Спасибо! Это лучший бесплатный datepicker, который я видел.
Только когда я выставляю русский язык, неделя все равно начинается в воскресенье.
Как это можно исправить?
Leroy
# Leroy 26.05.2015 14:31
http://xdsoft.net/jqplugins/datetimepicker/#dayOfWeekStart
Константин
# Константин 14.07.2015 18:31
Большое спасибо за плагин, очень понравился. Но у меня возник вопрос.
Мне необходимо организовать выбор промежутка между датами с выбором времени времени, такая возможность реализована в плагине, но как только я меняю формат даты эта возможность перестает работать, подскажите, пожалуйста как это можно реализовать?
На ум приходит, что это возможно через использование moment.js, я в правильном направлении мыслю?
Заранее благодарю!
php-coder
# php-coder 22.09.2015 12:44
Отличный плагин. Подскажите, пожалуйста, как сделать так, чтобы он срабатывал и для динамически создаваемых полей? Во всплывашке появляется форма и в ней уже календарь не работает.
Kirich
# Kirich 19.11.2015 13:37
Можно ли добавить два таймпикера в один инпут? Или, ещё лучше, если время будет в виде интервала, вроде такого: "12:00 - 16:00"
Leroy
# Leroy 20.11.2015 07:52
За 2$ автор сделал PeriodPicker http://xdsoft.net/jqplugins/periodpicker/ это то что вам нужно
Kirich
# Kirich 24.11.2015 13:38
Этот плагин я смотрел. Похоже это не то, что нужно.
И он достаточно громоздкий.
User
# User 02.12.2015 07:01
вот я идиот. все подключил по инструкции. при клике на поле календарь не всплывает. консоль браузера ошибок не выдает.
User
# User 02.12.2015 07:19
все. заработало. не тот js подключал. в архиве куча барахла. спс за каледарь
Лаэль
# Лаэль 17.12.2015 21:52
Здравствуйте, наверное, я что-то неправильно делаю, но у меня вместо календаря с datetimepicker отображается только оболочка, то есть стрелки в пустом окошке. Возможно вы знаете в чем проблема.
Lutsman
# Lutsman 25.03.2016 17:47
Уважаемый, хочу уточнить этот плагин делали вы или индусы из Бангалора?
в build/jquery.datetimepicker.full.js
/*!
* @copyright Copyright © Kartik Visweswaran, Krajee.com, 2014 - 2015
* @version 1.3.3
*
* Date formatter utility library that allows formatting date/time variables or Date objects using PHP DateTime format.
* @see http://php.net/manual/en/function.date.php
*
* For more JQuery plugins visit http://plugins.krajee.com
* For more Yii related demos visit http://demos.krajee.com
*/
Leroy
# Leroy 27.03.2016 17:04
Написано же Date formatter utility. Плагин с недавних пор использует ее.
Lutsman
# Lutsman 31.05.2016 10:38
Понятно.
Mellon
# Mellon 31.05.2016 10:10
Ни у кого не было проблем с локализацией? lang: 'ru' у меня почему-то не работает. Как правильно прописать язык? У кого заработало?
Lutsman
# Lutsman 31.05.2016 10:25
Цитирую Mellon:
Ни у кого не было проблем с локализацией? lang: 'ru' у меня почему-то не работает. Как правильно прописать язык? У кого заработало?


как-то так
$('#datepicker-calendar').DatePicker({
inline: true,
date: [from, to],
calendars: 3,
mode: 'range',
locale: {
daysMin: ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"],
months: ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"],
monthsShort: ["Ян", "Фев", "Март", "Апр", "Май", "Июнь", "Июль", "Авг", "Сен", "Окт", "Ноя", "Дек"]
},
current: new Date(to.getFullYear(), to.getMonth() + 1, 1)
});
Leroy
# Leroy 31.05.2016 11:17
Это у вас ведь не datetimepicker
Lutsman
# Lutsman 31.05.2016 11:50
Прошу, прощения. Вы правы, сначала ваш плагин поставил, но заказчик захотел другой и я сменил и забыл.
nice
# nice 03.08.2016 20:40
Почему календарь начинается с воскресенья? неделя должна с понедельника начинаться
mkorolkov
# mkorolkov 25.05.2017 18:05
Здравствуйте плагин в самом деле интереснее всех что удалось найти.
Но подключенный к Bootstrap 3.3.1 всплывающее модальное не привязывается к элементу, а всплывает внизу страницы. Пока не удается победить натолкните на идею пожалуйста.
Leroy
# Leroy 25.05.2017 21:31
Ну вы хоть код приложите
mkorolkov
# mkorolkov 25.05.2017 21:42
Start:
















$(document).ready(function () {
$('#datepicker').datetimepicker({
format:'Y-m-dTH:i:sZ',
minDate:'-1970/01/01',
startDate:new Date(),
todayButton: true,
});
$('#calendar').click(function(){
$('#datepicker').datetimepicker('show');
});
});
mkorolkov
# mkorolkov 25.05.2017 21:45
Start:
















$(document).ready(function () {
$('#datepicker').datetimepicker({
format:'Y-m-dTH:i:sZ',
minDate:'-1970/01/01',//yesterday is minimum date(for today use 0 or -1970/01/01)
startDate:new Date(),
todayButton: true,
});
$('#calendar').click(function(){
$('#datepicker').datetimepicker('show');
});
});
mkorolkov
# mkorolkov 25.05.2017 21:47
Код: <head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.datetimepicker.min.css" />
</head>
<body>
<div class="container">
<div class="row">
<div class="control-group" style="margin-top: 100;">
<span for="start" class="col-sm-2 control-label" style="margin-top: 10; color:black">Start: </span>
<div class="col-sm-10">
<div class="input-group" >
<input type="text" id="datepicker" class="form-control" />
<div class="input-group-addon">
<span id="calendar" class="glyphicon glyphicon-calendar" role="button"></span>
</div>
</div>
</div>
</div>
</div>
</div>
<script language="JavaScript" src="js/jquery-3.2.1.min.js" type="text/javascript"></script>
<script language="JavaScript" src="js/jquery.datetimepicker.full.min.js" type="text/javascript"></script>
<script language="JavaScript" src="js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#datepicker').datetimepicker({
format:'Y-m-dTH:i:sZ',
minDate:'-1970/01/01',//yesterday is minimum date(for today use 0 or -1970/01/01)
startDate:new Date(),
todayButton: true,
});
$('#calendar').click(function(){
$('#datepicker').datetimepicker('show');
});
});
</script>
</body>
Ultra
# Ultra 13.06.2017 17:31
Подскажите пожалуйста. Дано 2 инпута. Как сделать,чтобы во второй инпут нельзя было вставить значение меньше первого?(т.е. настоить диапазон)
TopClans
# TopClans 17.06.2017 16:26
На этой странице не работает ни один плагин.
У меня проблема: при включенном inline не отображается содержимое календаря, только элементы интерфейса: рамка, стрелки, кнопка "домой". Если нажать на стрелку календаря (переключить месяц), то всё загружается.
Что интересно: на этой странице: http://xdsoft.net/jqplugins/datetimepicker/ всё работает нормально, а у меня - нет. И даже во встроенном в архив примере тоже не работает.
TopClans
# TopClans 17.06.2017 17:01
Решил обновлением календаря с задержкой в 1мс:
jQuery('#datetimepicker3').datetimepicker('reset');

Но вот русский язык всё равно не работает, хотя в JS файле он есть, в конфиге я его тоже выбрал.
TopClans
# TopClans 21.06.2017 14:57
настраивается так:
$.datetimepicker.setLocale('ru');
pdgsmf79
# pdgsmf79 04.08.2017 13:17
Объясните, как такое может быть - в отдельной папке на сервере плагин работает. Переношу в корень - не работает?
Алексей1
# Алексей1 13.10.2017 14:06
Не пойму, как с него получать значения?
alert($('#datetimepicker').value); выдает какую то хрень.
Алексей1
# Алексей1 13.10.2017 15:12
с получением данных от датапикера разобрался

пример кода:


$('#datetimepicker').datetimepicker({
lang:'ru',
allowTimes:['00:00','04:00','12:00','15:00','18:00','23:59'],
minDate:'2016/01/01',
dayOfWeekStart:1,
});
$.datetimepicker.setLocale('ru');

timeis
Алексей1
# Алексей1 13.10.2017 15:14
$('#datetimepicker').datetimepicker({
lang:'ru',
allowTimes:['00:00','04:00','12:00','15:00','18:00','23:59'],
minDate:'2016/01/01',
dayOfWeekStart:1,
});
$.datetimepicker.setLocale('ru');

timeis
Алексей1
# Алексей1 13.10.2017 15:16
мда...
не могу вставить код, он интерпретируется серваком
а если так:
< input type="text" id="datetimepicker"/ >
< sscript >
$('#datetimepicker').datetimepicker({
lang:'ru',
allowTimes:['00:00','04:00','12:00','15:00','18:00','23:59'],
minDate:'2016/01/01',
dayOfWeekStart:1,
});
$.datetimepicker.setLocale('ru');
< /sscript >

< bbutton onclick="javascript: alert( date = $('#datetimepicker').val() );">timeis
Алексей1
# Алексей1 13.10.2017 15:18
Воо!
Код:<input type="text" id="datetimepicker"/> <script> $('#datetimepicker').datetimepicker({ lang:'ru', allowTimes:['00:00','04:00','12:00','15:00','18:00','23:59'], minDate:'2016/01/01', dayOfWeekStart:1, }); $.datetimepicker.setLocale('ru'); </script> <button onclick="javascript: alert( date = $('#datetimepicker').val() );">timeis</button>
www
# www 29.03.2018 09:13
почему выбор времени сделан неудобно?
как выбрать отдельно минуты и часы
Евгений А
# Евгений А 15.04.2018 09:07
При inline:true невозможно задать выбранную дату. Точнее, дата-то задается, да вот в календарике выбран все-равно текущий день.
Сегодня 15.04.2018. Ставлю $('#datetimepicker').val('16.04.2018'); получаю document.getElementById('datetimepicker').value - все верно. 16.04.2018, а в календаре выбрано 15.04.2018.
Евгений А
# Евгений А 15.04.2018 13:42
Небольшое уточнение% если ставить свойство value=какая-нибудь дата, то при загрузке страницы она устанавливается нормально в календаре.
При установке даты динамически она не меняется.
Роман Петрович
# Роман Петрович 26.03.2019 14:35
языки не подтягиваются
даже руский
Dmitriy76
# Dmitriy76 27.05.2019 20:48
После вызова календаря добавить ещё один вызов:
Код:$.datetimepicker.setLocale('ru');
Dmitriy76
# Dmitriy76 27.05.2019 22:50
Здравствуйте.
А если поместить этот календарь внутрь формы, в которой будут и другие поля.
И также в этой форме будет input type="reset" - то как возможно к этой кнопке сброса прицепить и возможность возвращать данные календаря в исходное положение?
Дмитрий Д
# Дмитрий Д 07.06.2019 15:22
Есть необходимость разрешать выбирать дату и время через 5 дней от текущей даты.
При открытии календаря, если кликнуть на время, то прокидывается текущий день, хотя этого происходить не должно. Также календарь можно закрыть предварительно выбрав только дату, а время будет записано текущее.
Подскажите, как это пофиксить?

Вот код инициализации:

jQuery('#montage-date-input').datetimepicker({
format: 'd.m.Y H:i',
inline: false,
lang: 'ru',
dayOfWeekStart: 1,
todayButton: false,
defaultSelect: false,
useCurrent: false,
minDate: '+1970/01/07',
startDate:'+1970/01/07',
defaultDate:'+1970/01/07',
maxDate:'+1970/01/05',
allowTimes:[
'10:00',
'14:00'
]
});
Сергей Золотарёв
# Сергей Золотарёв 04.08.2019 19:06
Добрый вечер!
Статья про JQuery Datetimepicker очень замечательная, но есть один недостаток-кроме того, что вы описывали опции плагина, не хватает описании событии, доступных в этом плагине!
Если что, опишите события в плагине, чтобы разработчики понимали, что это за плагин... :cry:
Заранее вам спасибо!
ivan kuznetsov
# ivan kuznetsov 12.09.2019 15:16
Спасибо за плагин. В моем приложении в десктопном варианте работает замечательно. А вот в мобильной версии время никак не выбрать. Просто нажимаю на список и ничего не происходит. Хотя на Вашей странице демо более-менее все работает и для мобильной версии. Я недавно занимаюсь веб разработкой, может что то делаю не так?
Рон Тайлер
# Рон Тайлер 18.07.2020 02:15
Не могу понять в чём проблема, выдаёт вот такую вот ошибку
Код:Uncaught TypeError: Cannot read property 'formatDate' of null
at jquery.datetimepicker.js:1804

Инициализация вот такая
Код:$('.datetime').datetimepicker({lang:'ru',format:'Y-m-d h:i:s',step:5, formatDate:'Y-m-d',formatTime:'h:i:s'});
Рон Тайлер
# Рон Тайлер 18.07.2020 02:43
Проблема решена мной подключение full версии из папки build