Есть
календарь datapicker на чистом
javascript.
<link href="https://unpkg.com/js-datepicker/dist/datepicker.min.css" rel="stylesheet"/>
<script src="https://unpkg.com/js-datepicker@5.16.0/dist/datepicker.min.js"></script>
<div class="datepicker">
<img src="https://img1.freepng.ru/20180403/lkq/kisspng-solar-calendar-symbol-computer-icons-encapsulated-calendar-icon-5ac41db82504c0.0773126515228021041516.jpg" width="50px" height="50px">
<input class="date-picker-element" type="text">
</div>
document.addEventListener('DOMContentLoaded', () => {
if (datepicker) {
let datepickerClickElem = document.querySelector('.datepicker img');
let datePickerElem = document.querySelector('.date-picker-element');
let picker = null;
if (datePickerElem) {
picker = datepicker(datePickerElem, {
customDays: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],
customMonths: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
});
if (datepickerClickElem) {
datepickerClickElem.addEventListener('click', function(e) {
e.stopPropagation();
let isHidden = picker.calendarContainer.classList.contains('qs-hidden');
if (isHidden) {
picker[isHidden ? 'show' : 'hide']();
}
});
}
}
}
})
Мне нужно его локализировать (месяцы, недели) в зависимости
html lang="ru-RU" или
lang="kz-KZ".
Для
datapicker библиотеки
jquery есть
такой вариант, но он кроме самой
jquery тянет за собой еще и
jquery ui, что совсем не вариант:
datepicker.regional.ru = {
closeText: "Закрыть",
prevText: "<Пред",
nextText: "След>",
currentText: "Сегодня",
monthNames: [ "Январь","Февраль","Март","Апрель","Май","Июнь",
"Июль","Август","Сентябрь","Октябрь","Ноябрь","Декабрь" ],
monthNamesShort: [ "Янв","Фев","Мар","Апр","Май","Июн",
"Июл","Авг","Сен","Окт","Ноя","Дек" ],
dayNames: [ "воскресенье","понедельник","вторник","среда","четверг","пятница","суббота" ],
dayNamesShort: [ "вск","пнд","втр","срд","чтв","птн","сбт" ],
dayNamesMin: [ "Вс","Пн","Вт","Ср","Чт","Пт","Сб" ],
weekHeader: "Нед",
dateFormat: "dd.mm.yy",
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: "" };
datepicker.setDefaults( datepicker.regional.ru );
