2016-07-27 3 views
0

저는 두 개의 datepcicker 텍스트 상자가 있습니다. 첫 번째 datepicker에서 임의의 날짜를 선택하면 두 번째 datepicker에서 + 7 일 자동으로 선택됩니다.가져오고 싶습니다 +7 선택한 날짜의 날짜

예 : 제 날짜 선택기에 선택한 기간 : 27-07-2016가 제 날짜 선택기 자동 같아야 2016년 3월 8일

$(function() { 
 
    $("#txtstart_date").datepicker(); 
 
}); 
 
$("#txtstart_date").change(function() { 
 
    crnt = toDate($("#txtstart_date").val()); 
 
    var nextWeekday = addDays(crnt, 7); 
 
    alert("nextday : " + nextWeekday); 
 
}); 
 

 
function addDays(dateObj, numDays) { 
 
    dateObj.setDate(dateObj.getDate() + numDays); 
 
    return dateObj; 
 
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
 
<div class="formelementblock"> 
 
    <div class="formelement"> 
 
    <input type="text" name="txtstart_date" class="input-text datepickerwidth required" id="txtstart_date" placeholder="Start Date*" /> 
 
    </div> 
 

 
</div> 
 
<div class="formelementblock last"> 
 
    <div class="formelement"> 
 
    <input type="text" name="txtend_date" class="input-text datepickerwidth required" id="txtend_date" placeholder="End Date*" /> 
 
    </div> 
 
</div>

답변

2

$(function() { 
 
    $("#txtstart_date").datepicker(); 
 
}); 
 
$("#txtstart_date").change(function() { 
 
    crnt = new Date($("#txtstart_date").val()); 
 
    var nextWeekday = addDays(crnt, 7); 
 
    alert("nextday : " + nextWeekday); 
 
    var end = $.datepicker.formatDate('mm/dd/yy', nextWeekday); 
 
    $("#txtend_date").val(end); 
 
}); 
 

 
function addDays(dateObj, numDays) { 
 
    dateObj.setDate(dateObj.getDate() + numDays); 
 
    return dateObj; 
 
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> 
 
<div class="formelementblock"> 
 
    <div class="formelement"> 
 
    <input type="text" name="txtstart_date" class="input-text datepickerwidth required" id="txtstart_date" placeholder="Start Date*" /> 
 
    </div> 
 

 
</div> 
 
<div class="formelementblock last"> 
 
    <div class="formelement"> 
 
    <input type="text" name="txtend_date" class="input-text datepickerwidth required" id="txtend_date" placeholder="End Date*" /> 
 
    </div> 
 
</div>

관련 문제