處理沒有 UpdatePanel 的快顯視窗控制項回傳 (VB)

作者 ：一個是一個

下載 PDF

AJAX 控制項工具組中的 PopupControl 擴充器提供一種簡單的方式，可在啟動任何其他控制項時觸發快顯。 在這類面板中發生回傳且頁面上有數個面板時，很難判斷已按一下哪個面板。

概觀

AJAX 控制項工具組中的 PopupControl 擴充器提供一種簡單的方式，可在啟動任何其他控制項時觸發快顯。 在這類面板中發生回傳且頁面上有數個面板時，很難判斷已按一下哪個面板。

步驟

搭配回傳使用 PopupControl 時，但在頁面上沒有 UpdatePanel 時，Control Toolkit 不會提供方法來判斷哪一個用戶端元素觸發了快顯，進而造成回傳。 不過，小型技巧會提供此案例的因應措施。

首先，以下是基本設定：兩個文字方塊會觸發相同的快顯視窗，也就是行事曆。 兩個 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>

當使用者按一下文字方塊時，就會顯示 [行事曆]， (按一下以檢視大小完整的影像)

按一下日期會將它放在文字方塊中， (按一下即可檢視大小完整的影像)

[上一步]