CalendarExtender Изменить дату с помощью Javascript - PullRequest
12 голосов
/ 05 мая 2009

У меня есть элемент управления CalendarExtender на моей странице, и иногда мне приходится менять дату на следующее воскресенье. В настоящее время я использую свойство OnClientDateSelectionChanged элемента управления для вызова функции, которая добавит несколько дней к дате до ее воскресенья.

Проблема, с которой я столкнулся, заключается в том, что если я выберу вторник в своем календаре, текстовое поле будет отображать следующее воскресенье, но выбранная дата в календаре все еще будет вторником.

Как мне обновить CalendarExtender, чтобы иметь новую дату, которую я выбрал в javascript? Текстовое поле, к которому подключен CalendarExtendar, показывает правильную дату ...

1 Ответ

28 голосов
/ 14 мая 2009

Изменение значения текстового поля, которое является TargetControlId для CalendarExtender влияет на выбранную дату , если выполнены следующие 2 условия:

  1. Событие onchange вызывается в текстовом поле (либо путем изменения текста вручную, либо путем вызова явного метода javascript fireEvent ().
  2. Формат даты, введенной в текстовое поле, соответствует формату, используемому элементом управления CalendarExtender.

При этом правильный способ справиться с этим - вызвать функцию set_selectedDate() элемента управления CalendarExtender. Этот один вызов не только устанавливает выбранное в календаре, но и одновременно в текстовом поле Targeted.

Вот пример кода:

<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>
...