strokoff

Плагин календарь jQuery date picker

jquery календарь

 

Хочу поделиться одним небольшим плагином для jQuery.
Кому не хочется читать, вот репа на github и вот демо пример, чтобы потыкать.

Небольшая предыстория) впервые плагином я поделился в песочнице хабра, после прочтения этого поста, но особого эффекта (13 уников перешедших на github) это не возымело. Но вдруг о плагине рассказали на jqueryscript.net и даже китайцы умудрились презентовать на htmleaf.com. И вот я в своем бложе спешу поделиться с вами либой).

В кратце о функциональности. Плагин умеет работать в режиме single и rangeDate, имеет зависимость от moment js, легко локализуется за счет тогоже moment, также можно настроить вариант отображения в виде выпадашки или modal mode. Изначально плагин написан в ES6 и имеет транспиленную ES5 версию. Шаблонизацию плагина решил делать с помощью конкатенации строк т.к. на мой взгляд это самый быстрый вариант формирования шаблона, что очень важно для маленького плагинчика. Вот список настроек плагина по умолчанию

{ 
  type: 'date', // || rangedate 
  startDate: moment(), //startDate 
  endDate: moment(), //endDate 
  locale: 'ru', 
  format: 'YYYY.MM.DD', //Display date format 
  delimiter: '-', // display visual delimiter for rangedate type picker 
  ranges: [], //ranges 
  modalMode: false, //display center on screen 
  onShow: () => {}, 
  onHide: () => {},
}

 

Для инициализации плагина необходмио подключить на страницу es5 или es6 версию, а также calendar.css. После, инициализация выглядит простым образом

$('#inputDate').DatePicker({
    startDate: moment()
});

За более подробными примерами обращайтесь на гитхаб или на демо страницу. Буду рад конструктивным комментариям и предложением по доработке на github.


Последняя редакция 17 января, 2023 в 03:01