如何使用下拉菜單修復jquery datepicker日期計算函數？

Question

我試圖創建一個腳本，根據下拉框的值，它會自動填充與指定日期相距四分之一，四分之二或四分之二的文本框。因此，對於價值季度1，box1將爲「1-1-2011」，box2將填入「1-4-2011」。目前我看不到更改日期的情況。我是一個初學者，並且一直在努力使這項工作好幾天。對不起，如果我忽略了一個明顯的問題。

的元件如下：

<div> 
<label>Periode</label> 
<select name="pchoice" id="pchoice" onChange="calcdates()"> 
<option value="moddate">Zelf invoeren</option> 
<option value="quarter1">1e Kwartaal</option> 
<option value="quarter2">2e Kwartaal</option> 
<option value="quarter3">3e Kwartaal</option> 
</select> 
</div> 
<div> 
    <label>Datum </label> <input id="startDate" name="startDate" maxlength="10" style="width: 6em;"/> t/m <input id="endDate" name="endDate" maxlength="10" style="width: 6em;"/> 
</div> 

的腳本：

<script type="text/javascript" charset="utf-8"> 
$(document).ready(
function() { 
    var datepickerparam = { 
    dateFormat : 'dd-mm-yy', 
     dayNamesMin : [ 'Zo', 'Ma', 'Di', 'Wo', 'Do', 'Vr', 'Za' ], 
    monthNames : [ 'Januari', 'Februari', 'Maart', 'April','Mei', 'Juni','Juli', 'Augustus', 'September','Oktober', 'November', 'December' ] 
    }; 

    $("#startDate").datepicker(datepickerparam); 
    $("#endDate").datepicker(datepickerparam); 
}); 

function calcdates(){ 

var w = document.pchoice.selectedIndex; 
var selected_text = document.pchoice.options[w].value; 
var commencedate = new Date("01-01-2011"); 
var end = new Date(); 
//make dynamic with some variable 
    switch(selected_text){ 
     case "quarter1": 
      $("#startDate").val(commencedate); 
      $("#endDate").val(commencedate+90); 
     break; 
     case "quarter2": 
      $("#startDate").value='12-03-2011'; 
      $("#endDate").value='12-06-2011'; 
     break; 
     case "quarter3": 
      $("#startDate").value='13-06-2011'; 
      $("#endDate").value='13-09-2011'; 
     break; 
     case "moddate": 
      $("#startDate").value = ''; 
      $("#endDate").value ='';    
     break; 
    } 
} 

Answer 1

添加日期：

var d=new Date();//as today or any other you wish 
var e=new Date(d.getFullYear()+"-"+(d.getMonth()+5)+"-"+d.getDate());// end Date 

我們新增五個，因爲一月是0，我們必須提供正確的月份

或添加4 * 30天，如果它的情況下

new Date(d.valueOf()+1000*60*60*24*4*30) 

Answer 2

我解決它。完整的解決方案是：

<div> 
    <label>Period</label> 
    <select name="pchoice" id="pchoice" > 
    <option value="moddate" selected="selected">Pick date</option> 
    <option value="quarter1">1st quarter</option> 
    <option value="quarter2">2nd quarter</option> 
    <option value="quarter3">3rd quarter</option> 
    </select> 

<% Date startdate = user.getContact().getOrganisation().getCommencingDate();//Customize this if you copy it! 
SimpleDateFormat formatter = new SimpleDateFormat("dd-MM-yyyy"); 
Calendar cal = Calendar.getInstance(); 
cal.setTime(startdate); 
HashMap <Integer,String> datemap = new HashMap<Integer,String>(); 
datemap.put(1, formatter.format(startdate)); 

for (int i=2; i<=6; i++){ 
    if (i%2 == 0){ 
     cal.add(Calendar.MONTH,3); 
    } 
    else { 
     cal.add(Calendar.DATE,1); 
    }  
    String formattedDate = formatter.format(cal.getTime()); 
    datemap.put(i, formattedDate); 
} 
%> 

$("select").change(function() { 
    var selected_text = $(this).val(); 

    switch(selected_text){ 
    case "quarter1": 
    $("#startDate").val("<%=datemap.get(1)%>");    
    $("#endDate").val("<%=datemap.get(2)%>"); 
    break; 
    case "quarter2": 
    $("#startDate").val("<%=datemap.get(3)%>"); 
    $("#endDate").val("<%=datemap.get(4)%>"); 
    break; 
    case "quarter3": 
    $("#startDate").val("<%=datemap.get(5)%>"); 
    $("#endDate").val("<%=datemap.get(6)%>"); 
    break; 
    case "moddate": 
     $("#startDate").val(''); 
     $("#endDate").val(''); 
    break;  
} 

});