jQuery 날짜 선택기 - 서로 상대 날짜 변경

Question

안녕하십니까, 사용자가 1 일부터 14 일까지만 선택할 수있는 예약 양식을 만들려고합니다 (현재 날짜 +1부터). 내가 가진 문제는 EndDate (여기 # #)가 오늘 날짜에서 14 일로 설정된다는 것입니다. 따라서 StartDate (여기 #fra)에서 한 달 앞당겨지면 EndDate에서 아무 것도 선택할 수 없습니다.

어떻게 EndDate를 StartDate에 상대적으로 설정합니까?

$(function valgavdato() { 
var dateFormat = "mm/dd/yy", 

    from = $("#fra") 
     .datepicker({ 
     minDate: '0+', 
     defaultDate: "+1w", 
     changeMonth: true, 
     numberOfMonths: 1 
     }) 
     .on("change", function() { 
     to.datepicker("option", "minDate", getDate(this)); 
     }), 
    to = $("#til").datepicker({ 
     maxDate: '14+', 
     defaultDate: "+1w", 
     changeMonth: true, 
     numberOfMonths: 1 
    }) 
    .on("change", function() { 
     from.datepicker("option", "maxDate", getDate(this)); 
    }); 

    function getDate(element) { 
    var date; 
    try { 
     date = $.datepicker.parseDate(dateFormat, element.value); 
    } catch(error) { 
     date = null; 
    } 

    return date; 
    } 
}); 

Answer 1

것은 maxDate가 +14 "오늘"로 부하에 설정되어 있다는 점이다.
14 일 + 선택 날짜를 계산해야합니다 ...

그래서, 여기 뭔가 효과가 있습니다.
은 가장 깨끗한 코드가 아닙니다. 코드화하는 방법은 ...
하지만 여전히 ... 작동합니다.

유일한 변경 (추가)은 변경시 #fra입니다.

$(function valgavdato() { 
 
    var dateFormat = "mm/dd/yy", 
 
     to_MaxDate = 14; // From date + this = to maxDate 
 

 
     from = $("#fra") 
 
    .datepicker({ 
 
     minDate: '0+', 
 
     defaultDate: "+1w", 
 
     changeMonth: true, 
 
     numberOfMonths: 1 
 
    }) 
 
    .on("change", function() { 
 
     var PickedDate = getDate(this); 
 
     // See that date is in UTC format. 
 
     console.log("From DatePicker: "+JSON.stringify(PickedDate)); 
 
     
 
     // Process the picked date. 
 
     var tempDay = PickedDate.getDate() + to_MaxDate; // Add a number of days to the picked date. 
 
     var tempMonth = PickedDate.getMonth() + 1; // Because months are zero based. 
 
     var tempYear = PickedDate.getYear() + 1900; // Because years are 1900 based 
 
     console.log("Temp date: "+ tempYear+"/"+tempMonth+"/"+tempDay +" --- It may look impossible... But Date() handles it."); 
 

 
     // Create a date object in a UTC format. 
 
     var newMaxDate = new Date(Date.UTC(tempYear, tempMonth-1, tempDay, 23, 59, 59)); 
 
     console.log( "New max date: : "+ JSON.stringify(newMaxDate)); 
 

 
     // Set the minDate ans maxDate options. 
 
     to.datepicker("option", {"minDate": PickedDate, "maxDate": newMaxDate}); 
 

 
    }), 
 
     to = $("#til").datepicker({ 
 
      maxDate: '14+', 
 
      defaultDate: "+1w", 
 
      changeMonth: true, 
 
      numberOfMonths: 1 
 
     }) 
 
    .on("change", function() { 
 
     from.datepicker("option", "maxDate", getDate(this)); 
 
    }); 
 

 
    function getDate(element) { 
 
     var date; 
 
     try { 
 
      date = $.datepicker.parseDate(dateFormat, element.value); 
 
     } catch(error) { 
 
      date = null; 
 
     } 
 

 
     return date; 
 
    } 
 
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script> 
 

 

 

 
<input type="text" id="fra"><br> 
 
<br> 
 
<input type="text" id="til">