calendarLite плагин

В одном из моих проектов мне понадобился простой javascript календарь. Но из существующих jQuery плагинов, только один «почти» соответствовал мои требованиям. Решил написать свой плагин — проба пера calendarLite plugin.



Особенности calendarLite:

• календарь предназначен для постоянного отображения на странице (не так как разные date picker)
• навигация по месяцам при помощи кнопок «Вперед» и «Назад»
• гибкая настройка (возможные опции смотрите ниже)

Для работы плагина, как обычно нужно подключить jquery и сам плагин. Рассмотри основные возможности данного плагина.

Установка формата ссылки

Можно задавать формат ссылки (для anchor), например для такого рода ссылок: http://snowcore.net/events/29–05–2009 Это можно сделать при помощи linkFormat опции 

Возможные 'linkFormat' опции

• {%dd} — дата с предшествующим нулем
• {%d} — дата без нуля
• {%mm} — месяц с предшествующим нулем
• {%m} — месяц без нуля
• {%yy} — год (два знака)
• {%yyyy} — полный год (четыре знака)

1. $('#cLinkFormat').calendarLite({
2.         linkFormat: 'http://snowcore.net/events/{%dd}-{%mm}-{%yyyy}'
3. });

Задание собственной функции-обработчика (callback)

Для клика на ячейке можно задавать свои обработчики. Callback функция принимает одно значение — выдранная дата. onSelect опция позволяет сделать это
Дополнительная опция dateFormat дает возможность установить формат даты, которая будет передаваться callback функции. Значение по умолчанию для dateFormat: '{%dd}.{%mm}.{%yyyy}'

1. $('#cCallback').calendarLite({
2.         dateFormat: '{%yyyy}-{%m}-{%d}',
3.         onSelect: function(date) {
4.                 alert(date);
5.                 return false;
6.         }
7. });

Настройка внешнего вида

Используя другие опции (и стили) можно настроить внешний вид календаря:

• showYear — если установлено в true, то вверху показывается год
• prevArrow и nextArrow — символы для кнопок 'Предыдущий' и 'Следующий'
• months и days — имена месяцев и дней (для мультиязычности)

1. $('#cStyle').calendarLite({
2.         showYear: true,
3.         prevArrow: '←',
4.         nextArrow: '→',
5.         months: ['January', 'February', 'March', 'April', 'May', 'June',
6.                          'July', 'August', 'September', 'October', 'November', 'December'],
7.         days: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']
8. });

Домашняя страница плагина: calendarLite homepage

Страница проекта на сайте plugins.jquery.com: calendarLite plugin

Скачать плагин можно на Google Code: calendarLite