Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.10.2019, 11:18
Профессор
Отправить личное сообщение для dima85 Посмотреть профиль Найти все сообщения от dima85
 
Регистрация: 14.03.2010
Сообщений: 161

AIR datapicket - выделить даты на календарике из массива
http://t1m0n.name/air-datepicker/doc...custom-content
Ниже рабочий код, он в каждый месяц, в каждую дату: 1, 10, 12, и 22 добавляет '<span class="dp-note"></span>'

Я хочу переделать массив eventDates и сделать такого вида:
Код:
 eventDates = ['2019-10-01', '2019-10-10', '2019-10-12', '2019-10-22'],
Насколько я понимаю 10 строчка должна выглядеть как-то так, но она не работает и не выдает ошибок, подскажите как правильно ее написать:
Код:
if (cellType == 'day' && date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate() == new Date(eventDates)) {
var eventDates = [1, 10, 12, 22],
    $picker = $('#custom-cells'),
    $content = $('#custom-cells-events'),

$picker.datepicker({
    language: 'en',
    onRenderCell: function (date, cellType) {
        var currentDate = date.getDate();
        // Add extra element, if `eventDates` contains `currentDate`
        if (cellType == 'day' && eventDates.indexOf(currentDate) != -1) {
            return {
                html: currentDate + '<span class="dp-note"></span>'
            }
        }
    }
})

// Select initial date from `eventDates`
var currentDate = currentDate = new Date();
$picker.data('datepicker').selectDate(new Date(currentDate.getFullYear(), currentDate.getMonth(), 10))

Последний раз редактировалось dima85, 22.10.2019 в 12:49.
Ответить с цитированием
  #2 (permalink)  
Старый 22.10.2019, 16:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,109

air-datepicker выделение дат из массива
dima85,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div.datepicker--cell.datepicker--cell-day.dp-note{
      border: #FF0000 2px solid;
  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/css/datepicker.min.css" rel="stylesheet" type="text/css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/air-datepicker/2.2.3/js/datepicker.min.js"></script>

  <script>
$(function() {
var eventDates = ['2019-10-01', '2019-10-10', '2019-10-12', '2019-10-22'].map(a => (a = new Date(a), a.setHours(0,0,0,0), a.getTime())),
    $picker = $('.date');

$picker.datepicker({
    onRenderCell: function (date, cellType) {
        var currentDate = date.getTime();
        if (cellType == 'day' && eventDates.indexOf(currentDate) != -1) {
            return {
                classes: "dp-note"
            }
        }
    }
})

// Select initial date from `eventDates`
var currentDate = currentDate = new Date();
$picker.data('datepicker').selectDate(new Date(currentDate.getFullYear(), currentDate.getMonth(), 10))

});
  </script>
</head>

<body>

<div class="date"></div>
</body>
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 22.10.2019, 16:31
Профессор
Отправить личное сообщение для dima85 Посмотреть профиль Найти все сообщения от dima85
 
Регистрация: 14.03.2010
Сообщений: 161

Спасибо большое. Отблагодарю на телефон как обычно.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск