Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Datepicker установка даты с интервалом от выбранной (https://javascript.ru/forum/dom-window/78802-datepicker-ustanovka-daty-s-intervalom-ot-vybrannojj.html)

basicom 07.11.2019 11:31

Datepicker установка даты с интервалом от выбранной
 
Есть datepicker. Нужна дата с интервалом, например "-2m" от выбранной.
Установка setDate работает только от текущей даты:

$('#dateFirst').datepicker("setDate",-2m);

Как считать дату -2 месяца от выбранной на календаре и при этом календарь оставить на выбранной дате?
Можно сделать без парсирования текстового поля, а средствами datepicker?

рони 07.11.2019 11:43

Цитата:

Сообщение от basicom
Как считать дату -2 месяца от выбранной на календаре и при этом календарь оставить на выбранной дате?

:-? моя твоя не понимай.

basicom 07.11.2019 11:51

<script>
        function getTables() {
            var start = document.getElementById("start").value;
            var end = document.getElementById("end").value;
            var partners_id = $("#clients").val().toString();

            $('#start').datepicker("setDate","-2m");
            var startDens = document.getElementById("start").value;
            $('#start').datepicker("setDate","0m");

Нужно получить дату на 2 месяца ранее, чем та которую выбрали на календаре. Выше написанный кусочек кода получает дату раньше на 2 месяца от сегодняшней, а не выбранной.

рони 07.11.2019 14:20

datepicker выделение диапазона дат
 
basicom,

<!doctype html>



<html lang="en">

<head>

  <meta charset="utf-8" />

  <title>jQuery UI Datepicker - Default functionality</title>
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/sunny/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
   <style type="text/css">

body{
     font-size: 12px;
   }
.highlight_days .ui-state-default{
    background: rgba(102, 255, 102, 1)
}
.highlight_days: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 events = [];
function bigDay(date, arr)
{
  return arr.some(function(el) {
  return date >= new Date(el[0]) && date <= new Date(el[1])
})
}

$.datepicker.setDefaults($.datepicker.regional['ru']);
$( '#datepicker' ).datepicker({
numberOfMonths: [1, 3],
dateFormat: "yy.mm.dd",
beforeShowDay: function(date) {
return bigDay(date, events) ? [true, 'highlight_days', null] : [true, '', null];
 },
onSelect : function(dateText, elem) {
  var date = $.datepicker.parseDate( "yy.mm.dd", dateText);
  var dateLast = $.datepicker.formatDate( "yy-mm-dd", date );
      date.setMonth(elem.selectedMonth - 2);
      $('#datepicker').datepicker("setDate",date); 
  var dateFirst = $.datepicker.formatDate( "yy-mm-dd", date );
     events = [[dateFirst, dateLast]];
     $( '[name="startDate"]' ).val(dateFirst);
     $( '[name="endDate"]' ).val(dateLast);
}
})
  });
  </script>
</head>
<body>
<div id="datepicker"></div>
<input name="startDate">
<input name="endDate">
</body>
</html>

basicom 08.11.2019 10:06

рони,
Спасибо за развёрнутый ответ. Но вот незадача, оказывается в javascript нет глобальных переменных?((
Если я в функции записал значение в переменную, то при выходе из функции она теряет значение?

рони 08.11.2019 10:24

Цитата:

Сообщение от basicom
Но вот незадача, оказывается в javascript нет глобальных переменных?((

бред, какой - то, куда они делись?
Цитата:

Сообщение от basicom
Если я в функции записал значение в переменную, то при выходе из функции она теряет значение?

не понимаю.
выбрали дату, передали в нужную функцию.
вместо или вместе $( '[name="startDate"]' ).val(dateFirst);
fn(dateFirst)

basicom 08.11.2019 14:39

Т.е. простого способа передвинуть календарь на нужный интервал от выбранной даты не существует?
У меня сейчас 2 пути:
1. изучать весь javasсript чтобы понять что Вы написали и зачем или
2. пропарсить строку "yyyy-mm-dd", обработать вручную вычитание месяца и передать в переменную.

рони 08.11.2019 15:11

Цитата:

Сообщение от basicom
Т.е. простого способа передвинуть календарь на нужный интервал от выбранной даты не существует?

:-?
строка 72 пост #4.

basicom 11.11.2019 12:14

<script>
      function getTables() {
        var start = document.getElementById("start").value;
        var end = document.getElementById("end").value;
        var partners_id = $("#clients").val().toString();
        s1=Number(start.replace(/\D+/g,""));
        let per=-2;
 	$('#Dstart').datepicker("setDate", per+"m");
	var startD = document.getElementById("Dstart").value;
	s2=Number(startD.replace(/\D+/g,""));
        while (s1 < s2 ) {
 	    per=--per;
            $('#Dstart').datepicker("setDate", per+"m");
            startD = document.getElementById("Dstart").value;
	    s2=Number(startD.replace(/\D+/g,""));
	}

        var startDens = document.getElementById("Dstart").value;



решил пока таким образом оставить для теста

рони 11.11.2019 12:42

basicom,
:-?


Часовой пояс GMT +3, время: 14:33.