CalendarExtender Change date with Javascript

Changing the value of the textbox that is the TargetControlId for the CalendarExtender affects the selected date if the following 2 conditions are met:

  1. An onchange event is fired on the textbox (either by changing the text manually or by calling an explicit javascript fireEvent() method.
  2. The format of the date entered in the textbox matches the same format used by the CalendarExtender control.

That being said, the correct way to handle this is to call the set_selectedDate() function of the CalendarExtender control. This one call, not only sets the selected on the Calendar, but also on the Targeted textbox at the same time.

Here's the example code:

<cc1:CalendarExtender ID="CalendarExtender1" runat="server" 
        OnClientDateSelectionChanged="dateSelectionChanged" 
        TargetControlID="txtDate" PopupButtonID="imgCalendar">
</cc1:CalendarExtender>

<script type="text/javascript">
  function dateSelectionChanged(sender, args){
    selectedDate = sender.get_selectedDate();
    /* replace this next line with your JS code to get the Sunday date */
    sundayDate = getSundayDateUsingYourAlgorithm(selectedDate); 
    /* this sets the date on both the calendar and textbox */
    sender.set_SelectedDate(sundayDate); 
 }
</script>