Поделиться через


Обработка операций обратной передачи из элемента управления Popup без использования элемента управления UpdatePanel (VB)

Кристиан Венц (Christian Wenz)

Загрузить PDF-файл

Расширитель PopupControl в наборе элементов управления AJAX позволяет легко активировать всплывающее окно при активации любого другого элемента управления. Когда на такой панели происходит обратная связь и на странице есть несколько панелей, трудно определить, какая панель была нажата.

Общие сведения

Расширитель PopupControl в наборе элементов управления AJAX позволяет легко активировать всплывающее окно при активации любого другого элемента управления. Когда на такой панели происходит обратная связь и на странице есть несколько панелей, трудно определить, какая панель была нажата.

Этапы

При использовании с обратной PopupControl отправкой, но без на UpdatePanel странице, набор средств управления не предлагает способ определить, какой клиентский элемент активировал всплывающее окно, которое, в свою очередь, вызвало обратную передачу. Однако небольшой трюк предоставляет обходной путь для этого сценария.

Прежде всего, вот базовая настройка: два текстовых поля, которые оба запускают одно и то же всплывающее окно, календарь. Два PopupControlExtenders элемента объединяют текстовые поля и всплывающие окна.

<form id="form1" runat="server">
 <asp:ScriptManager ID="asm" runat="server" />
 <div>
 Departure date: <asp:TextBox ID="tbDeparture" runat="server" />
 Return date: <asp:TextBox ID="tbReturn" runat="server" />
 </div>
 <asp:Panel ID="pnlCalendar" runat="server">
 <asp:Calendar ID="c1" runat="server" OnSelectionChanged="c1_SelectionChanged" />
 </asp:Panel>
 <ajaxToolkit:PopupControlExtender ID="pce1" runat="server"
 TargetControlID="tbDeparture" PopupControlID="pnlCalendar" Position="Bottom" />
 <ajaxToolkit:PopupControlExtender ID="pce2" runat="server"
 TargetControlID="tbReturn" PopupControlID="pnlCalendar" Position="Bottom" />
</form>

Основная идея заключается в добавлении скрытого поля формы в <form> элемент, содержащий текстовое поле, которое запустило всплывающее окно:

<input type="hidden" id="tbHidden" runat="server" />

При загрузке страницы код JavaScript добавляет обработчик событий в оба текстовых поля. Каждый раз, когда пользователь щелкает текстовое поле, его имя записывается в скрытое поле формы:

<script type="text/javascript">
 function pageLoad()
 {
 $get("tbDeparture").onclick = saveTextBox;
 $get("tbReturn").onclick = saveTextBox;
 }
 function saveTextBox()
 {
 $get("tbHidden").value = this.id;
 }
</script>

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

<script runat="server">
 Protected Sub c1_SelectionChanged(sender As object, e As EventArgs)
 Dim id As String = tbHidden.Value
 If (id = "tbDeparture" Or id = "tbReturn")
 Dim tb As TextBox = CType(FindControl(id), TextBox)
 tb.Text = CType(sender, Calendar).SelectedDate.ToShortDateString()
 End If
 End Sub
</script>

Календарь появляется, когда пользователь щелкает текстовое поле

Календарь появляется, когда пользователь щелкает текстовое поле (щелкните для просмотра полноразмерного изображения)

Если щелкнуть дату, она помещется в текстовое поле

Если щелкнуть дату, она помещется в текстовое поле (щелкните для просмотра полноразмерного изображения)