Javascript-форум - Как выбрать несколько дат в календаре

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Как выбрать несколько дат в календаре (https://javascript.ru/forum/misc/59634-kak-vybrat-neskolko-dat-v-kalendare.html)

Как выбрать несколько дат в календаре

Вот сам календарик http://jsfiddle.net/sk9mph4o/
Хочу сделать что бы не 1 дату можно было выбрать а много, что бы отменить выбор надо повторно нажать на выбранную дату. Все выбранные положить в какой ни будь массив.

mrbanan,
может этот http://jqueryui.com/datepicker/ будет проще освоить?

Ну во-первых он тоже даёт только одну дату выбрать.
Во-вторых там где можно обойтись без jQuey надо без него обойтись. В этом календаре я уже разобрался, поменял что надо под себя и в процессе работы подучиваю JS, но на некоторые вещи пока знаний не хватает...

Цитата:

Сообщение от mrbanan

Ну во-первых он тоже даёт только одну дату выбрать.

всё зависит от настройки
а в вашем слишком много нужно будет менять

И что? Лениво объяснить, подсказать, направить в нужную сторону? Ну ладно, извините )))

datepicker и выделение нескольких дат

покликайте по датам ... в вашем календаре надо сделать примерно тоже самое сформировать массив дат по клику (или удаление) и поставить проверку массива в начале // Выбранный день

<!doctype html>



<html lang="en">

<head>

  <meta charset="utf-8" />

  <title>jQuery UI Datepicker - Default functionality</title>

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css" />

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  <link rel="stylesheet" href="/resources/demos/style.css" />
   <style type="text/css">

   body{
     font-size: 12px;
   }
.active .ui-state-default{
    background: rgba(102, 255, 102, 1)
}
.active:hover .ui-state-default{
    background: rgba(255, 255, 0, 1)
}

.test .ui-state-default{
    background: rgba(255, 215, 0, 1)
}
   </style>
  <script>

  $(function() {

    $.datepicker.regional['ru'] = {
		closeText: 'Закрыть',
		prevText: '&#x3c;Пред',
		nextText: 'След&#x3e;',
		currentText: 'Сегодня',
		monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
		monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн', 'Июл','Авг','Сен','Окт','Ноя','Дек'],
		dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
		dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
		dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
		dateFormat: 'dd.mm.yy',
		firstDay: 1,
		isRTL: false,
		showOtherMonths:true,
		selectOtherMonths:true,
		changeMonth:true,
        changeYear: false,
        showAnim:'scale'
};
var arr_data = [];
$.datepicker.setDefaults($.datepicker.regional['ru']);
$( '#datepicker' ).datepicker({ altField: "#show", altFormat: "yy-mm-dd",
beforeShowDay: function(date) {
for (var i=0; i<arr_data.length; i++)  { var d = arr_data[i];
d = d.split('.');
if (date.getTime() == (new Date(d[2],d[1]-1,d[0])).getTime()) return[true, "active", "Важная дата"] };
return[true, "test"]},
onSelect : function(value,b) {
  var ok = $.inArray(value, arr_data) ;
  if (ok == -1) arr_data.push(value)
  else {arr_data.splice(ok,1)};
  alert(JSON.stringify(arr_data));
}
})
  });
  </script>
</head>
<body>
<div id="datepicker"></div>
</body>
</html>