Топ плагинов jQuery. Плагин jQuery календарь DateDropper

Топ плагинов jQuery. Плагин jQuery календарь DateDropper

От автора: и снова здравствуйте. Позвольте представить вам очередной плагин из разряда must have. Давайте поработаем с еще одним плагином – речь идет о расширении jQuery календарь под названием DateDropper. Уверен, вам понравится этот jQuery календарь даты – смотрится он очень интересно.

В сети можно найти множество различных видов плагинов jQuery календарь для выбора даты. Это и известные jQuery UI календарь, и jQuery календарь даты для Bootstrap, и десятки других календарей. Мы сегодня рассмотрим один из таких плагинов jQuery календаря даты.

Итак, познакомиться с документацией к плагину jQuery календарь и примерами его использования можно на этом сайте. Там же можно и скачать сам плагин календаря. Также можете взять его файлы из исходников статьи. Подключим файл стилей и сам скрипт календаря.

Теперь нам потребуется поле для ввода некоторой даты, именно к этому полю мы и прикрутим jQuery календарь.

Осталось инициализировать плагин вызовом метода dateDropper().

Посмотрим, получилось ли у нас что-то. Для этого кликнем по полю формы.

Топ плагинов jQuery. Плагин jQuery календарь DateDropper

Великолепно! Плагин jQuery календарь работает и смотрится очень круто. При наведении на элемент даты (месяц, число, год) появляются стрелки влево и вправо, которые позволяют листать соответствующие части даты. Также мы можем сделать быстрый выбор просто кликнув по нужному сегменту, например кликнем по месяцу.

Топ плагинов jQuery. Плагин jQuery календарь DateDropper

В общем, все интуитивно понятно и, главное, полученный календарь смотрится очень оригинально. Также плагин jquery datedropper имеет множество опций, с полным списком которых можно ознакомиться в документации. Например, давайте русифицируем плагин и изменим формат даты, которая будет добавлена в поле даты после выбора:

После этого календарик будет русифицирован:

Топ плагинов jQuery. Плагин jQuery календарь DateDropper

И выбранная дата примет привычный нам формат: день-месяц-год.

Топ плагинов jQuery. Плагин jQuery календарь DateDropper

Надеюсь, данный вариант jQuery календаря вам пришелся по нраву, и вы найдете ему применение. На этом у меня сегодня все. Исходники к статье вы можете скачать по ссылке. Больше о jQuery и JavaScript вы можете узнать из наших уроков или курса. Удачи!

Метки:

Похожие статьи:

Комментарии Вконтакте: