CalendarExtender Изменить дату с помощью Javascript

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

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

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

Ответы

Ответ 1

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

  • Событие onchange запускается в текстовом поле (либо путем изменения текста вручную, либо путем вызова явного метода javascript fireEvent().
  • Формат даты, введенной в текстовое поле, совпадает с тем же форматом, который используется элементом управления 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>

Ответ 2

<asp:TextBox ID="txtDate" Text='<%# Bind("Date", "{0:dd-MMM-yyyy}") %>'
                                                                                            runat="server" class="form-control input-sm m-bot15" BackColor="#ffccbb"></asp:TextBox>
                                                                                        <asp:CalendarExtender ID="CalExtender1" runat="server" Enabled="true" Format="dd-MMM-yyyy"
                                                                                            TargetControlID="txtDate">
                                                                                        </asp:CalendarExtender>