Currently, I am utilizing two AJAX calendar extenders for my project.
The first one is for the Start Date and the second one is for the End Date.
My requirement is that the end date should always be 60 days ahead of the start date.
The date format from the calendar extender is set as dd-MMM-yyyy (e.g. 08-May-2014).
Here is the code snippet:
<div>
<asp:TextBox ID="EFF_START_DATEDVTextBox" runat="server" onchange="javascript:EndDateTimeEndDate();" Width="100px" CssClass="txtbox"></asp:TextBox>
<ajax:CalendarExtender ID="EFF_START_DATEDVCalendarExtender" runat="server" TargetControlID="EFF_START_DATEDVTextBox" Format="dd-MMM-yyyy">
<div>
<asp:TextBox ID="EFF_END_DATEDVTextBox" onchange="javascript:EndDateTimeEndDate();" runat="server" Width="100px" CssClass="txtbox"></asp:TextBox>
<ajax:CalendarExtender ID="EFF_END_DATEDVCalendarExtender" runat="server" TargetControlID="EFF_END_DATEDVTextBox" Format="dd-MMM-yyyy"> </ajax:CalendarExtender>
</div>
For example, when a user selects a start date, the end date should automatically be set to 60 days after that, and vice versa.
I attempted to implement this functionality but faced issues with converting the date time properly. Here's the relevant JavaScript function:
function EndDateTimeEndDate() {
var datestart = new Date(document.getElementById('<%=EFF_START_DATEDVTextBox.ClientID %>').value);
var dateEnd = new Date(document.getElementById('<%=EFF_END_DATEDVTextBox.ClientID %>').value);
alert(datestart);
document.getElementById('<%=EFF_START_DATEDVTextBox.ClientID %>').value = datestart + 60;
}