Отличный выпадающий календарь на Jquery для Вашего сайта

Сегодня рассмотрим прекрасный календарь на Jquery для Вашего сайта. Демонстрацию можно посмотреть здесь. Календарь появляется при клике по текстовому полю. После чего, пользователь выбирает дату и время - и эти параметры автоматически прописываются в текстовом поле

Чтобы подключить данный календарь, сначала подключаем Jquery:

  <script type="text/javascript" src="jquery.js?banner=off"></script>

Затем пишем тектовое поле:

  <input type="text" value="" id="datetimepicker" name="datetimepicker"/>

Подключаем скрипт и стили:

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

Запускаем скрипт:

  <script>
    $.datetimepicker.setLocale('ru');

    $('#datetimepicker').datetimepicker({
      dayOfWeekStart : 1,
      lang:'ru',
      format:'d M Y H:i',
      disabledDates:['2016/09/21','2016/09/29'],
      startDate: 0,
      step:30,
      minDate:0,
      allowTimes:['10:00', '11:00', '12:00', '13:00', '14:00','15:00'],
      disabledWeekDays:[0,6]
    });
  </script>
	

Основные настройки:

format - Формат даты, который появляется в текстовом поле. d - число, D - день недели, m - пишется месяц числом, M-пишется месяц буквами, y-пишется год двумя цифрами, Y-пишется год полность.

disabledDates - Сделать дату неактивной. Писать даты нужно в таком формате 2016/09/21.

allowTimes - Сетка времени.

disabledWeekDays - Если хотим исключить какой-нибудь день недели. 0 - это воскресение, 1-понедельник, 2-вторник, 3-среда, 4-четверг, 5-пятница, 6-суббота.