Javascriptを使用してHTMLの日付フィールドから日付を取得する方法

Question

ヘルプをリクエストしています。私は入力フィールドから日付を取得しようとしています。ユーザーはカレンダーをクリックして日付を選択し、入力フィールドに日付が表示されます。私は選択した日付から30日を計算するために、JavaScript関数を使って日付を取得する必要があります。 HTMLとJavaScriptの使用。日付の選択のための

HTMLコーディング：

<div id="divAwarenessDate" class="fieldRow"> 
    <div class="leftLabel labelWidth20"> 
     <label for="txtAwarenessDate_date" class="reqdLabel">* Awareness 
      Date:</label> 
    </div> 
<div class="leftField"> 
    <div class="formField34"> 
     <input id="txtAwarenessDate_date" type="text" class="readonly 
      textfield textfield35 required" readonly="readonly" alt="Awareness 
      Date" title="Awareness Date" /> 
     <input id="btnAwarenessDateCalendar" type="button" 
      class="calendarImage" title="Awareness Date" /> 
    </div> 
</div> 
</div> 

HTMLコードは、30日以上の日付を取得し、追加するには、JavaScript関数に要求を提出する：

<div class="leftLabel labelWidth22"> 
    <label for="">A. Has a death occurred?</label> 
</div> 
<div class="leftField"> 
<div class="formField34"> 
<input id="rbDeathOccurred" name="rbDeathOccurred" type="radio" 
    class="radiobuttonfield" alt="Death Occurred" title="Death Occurred" 
    value="Yes" onclick="javascript:USAYesNoCheckDO();" />Yes 
<input id="rbDeathOccurred" name="rbDeathOccurred" type="radio" 
    class="radiobuttonfield" alt="Death Occurred" title="Death Occurred" 
    value="No" onclick="javascript:USAYesNoCheckDO();" />No 
</div> 
</div> 
<p>&nbsp;</p> 
<div id="USADOYesNo" style="display:none"> 
<ol type="a" class="indentList"> 
    <li>Is there a reasonable possibility that a device failure or 
     malfunction was a direct or indirect factor in the death? 
     <br> 
     <input id="rbDOYesNo" name="rbDOYesNo" type="radio" 
     class="radiobuttonfield" alt="Yes - Reportable" title="Yes - 
     Reportable" value="Yes" 
     onclick="javascript:USDeviceFailure30Days();" /> 
     <label for="rbDOYesNo" class="rptColor">Yes - Reportable - 30 days 
     from today's date</label> 
     <input id="rbDOYesNo1" name="rbDOYesNo" type="radio" 
     class="radiobuttonfield" alt="No" title="No" value="No" 
     onclick="javascript:USDeviceFailure30Days();" />No 
    <div id="calc" class="indentListCalc"> 
     <input id="dt30Days" type="text" 
     class="textfieldCalc labelWidth25" /> 
    </div> 
     <br> 
     </li> 
    </ol> 
    </div> 

JavaScriptのコーディング - 関数を呼び出す関数：

function USDeviceFailure30Days() { 
    if (document.getElementById('rbDOYesNo').checked) { 
    document.getElementById('calc').style.display = 'block'; 
    date30Days(); 

} else { 

    document.getElementById('calc').innerHTML = ''; 
    document.getElementById('calc').style.display = 'none'; 

    } 
} 

計算のためのJavaScriptコードn関数：

function date30Days(){ 
var dt = document.getElementById(txtAwarenessDate_date); 
dt.setDate(dt.getDate() + 30); 
var mo = dt.getMonth() + 1; // JS months are 0 to 11, so need to add 1 
var dy = dt.getDate(); 
var yr = dt.getYear() % 100; // just to make sure only 2 digit year 
var dueDate = (mo < 10 ? "0" : "") + mo + "/" + (dy < 10 ? "0" : "") 
+ dy + "/" + (yr < 10 ? "0" : "") + yr; 
var text = "30 days from today is "; 

    document.getElementById('calc').innerHTML = text + dueDate; 

} 

私はHTMLとJavaScriptを初めて使用しています。 ご協力いただきありがとうございます。

アイリーン

Answer 1

は

function date30Days(){ 
var dt = new Date(document.getElementById('txtAwarenessDate_date').value); 
dt.setDate(dt.getDate() + 30); 
var mo = dt.getMonth() + 1; // JS months are 0 to 11, so need to add 1 
var dy = dt.getDate(); 
var yr = dt.getYear() % 100; // just to make sure only 2 digit year 
var dueDate = (mo < 10 ? "0" : "") + mo + "/" + (dy < 10 ? "0" : "") 
+ dy + "/" + (yr < 10 ? "0" : "") + yr; 
var text = "30 days from today is "; 

    document.getElementById('calc').innerHTML = text + dueDate; 

} 

ちょうどパラメータとして入力＃のtxtAwarenessDate_date値を渡し、これを試してみてください。