I have a text box where I need to save the chosen date from a calendar. To achieve this, I am using an AJAX calendar extender and setting the target control property to the textbox ID. However, when I click on a button on the same page, I lose the selected date (meaning I lose the text value), but I want to retain the selected date after clicking the button.
<td>
<asp:TextBox ID="txtDate" runat="server" ReadOnly="true"></asp:TextBox>
</td>
<td>
<asp:ImageButton ID="imgCalender" runat="server" ImageUrl="~/Images/Calendar.png" ToolTip="Select a Date" />
<asp:CalendarExtender ID="calShow" runat="server" PopupButtonID="imgCalender" PopupPosition="BottomLeft" TargetControlID="txtDate" OnClientDateSelectionChanged="CheckForPastDate"></asp:CalendarExtender>
</td>
Additionally, I would like it so that if a user tries to select a date more than 20 days ahead of the current date, the text box should be cleared, requiring the user to select a proper date again.
Javascript
var selectedDate = new Date();
selectedDate = sender._selectedDate;
var todayDate = new Date();
if (selectedDate.getDateOnly() <= todayDate.getDateOnly()) {
alert('Date Cannot be in the past or current date');
sender._textbox.set_Value(null);
} else if(selectedDate.getDateOnly() > todayDate.getDateOnly()) {
// This placeholder indicates room for further code implementation
}