文章出處

前言

FineUI中的Window控件常用作選擇、新增或編輯內容。而關閉Window控件卻有很多技巧，了解這些技巧有助于項目的快速開發。

如何關閉Window控件

第一個問題就是如何關閉Window控件，最明顯的方式就是右上角的關閉圖標了。總的說來，有三種方式：

ESC按鍵（在Window控件所在頁面獲取焦點的情況下，按下鍵盤的ESC將會關閉當前激活窗體）
窗體右上角的關閉圖標
用戶自定義的關閉按鈕

前兩種方式自不必說，那么如何自定義關閉按鈕呢？有兩種做法：

按鈕禁用回發，在頁面初始化時注冊關閉腳本

1 <f:Button ID="btnHideInClient" CssClass="inline" Text="隱藏窗體（客戶端代碼）" EnablePostBack="false"
2             runat="server">
3 </f:Button>

1 protected void Page_Load(object sender, EventArgs e)
2 {
3     if (!IsPostBack)
4     {
5         btnHideInClient.OnClientClick = Window2.GetHideReference();
6     }
7 }
8

按鈕回發，在回發事件中設置窗體Hidden屬性，

1 <f:Button ID="btnHideInServer" Text="隱藏窗體（服務端代碼）" runat="server" OnClick="btnHideInServer_Click">
2 </f:Button>

1 protected void btnHideInServer_Click(object sender, EventArgs e)
2 {
3     Window2.Hidden = true;
4 }

或者注冊關閉腳本：

1 protected void btnHideInServer_Click(object sender, EventArgs e)
2 {
3     PageContext.RegisterStartupScript(Window2.GetHideReference());
4 }

當然，這里按鈕是和Window控件在同樣一個頁面的。

對于另一種常見情況，也即啟用IFrame的Window控件，位于IFrame頁面內的按鈕如何關閉父頁面中的這個Window控件呢？

顯然，我們無法在IFrame頁面內獲取Window控件的實例！

沒關系，FineUI提供了ActiveWindow類來處理這個常見問題：

1 protected void btnSaveContinue_Click(object sender, EventArgs e)
2 {
3     PageContext.RegisterStartupScript(ActiveWindow.GetHideReference());
4 }

關閉窗體的方式

前面提到的關閉窗體，只是簡單的關閉，并未做任何其他處理。其實FineUI提供了三種關閉窗體的方式：

直接關閉：也就是前面提到的 GetHideReferene 方法返回的腳本
關閉窗體，然后回發窗體所在的頁面，觸發Window控件的Close事件：可以使用內置的 GetHidePostBackReference 方法
關閉窗體，然后刷新窗體所在的頁面：可以使用內置的 GetHideRefreshReference 方法

再回到前面介紹的"如何關閉窗體"，顯然前兩種關閉方法（ESC，右上角關閉圖標）無法使用 GetHide***Reference 方法，怎么辦？

FineUI同時為Window控件提供了 CloseAction 屬性，可能的值為 Hide，HidePostBack 和 HideRefresh，分別對應上述方法。

來看一個例子：

初始顯示

點擊右上角關閉圖標，觸發了Close事件

這個行為是由Window控件的CloseAction屬性控制的，來看下控件標簽：

1 <f:Window ID="Window2" Width="650px" Height="300px" Icon="TagBlue" Title="窗體" Hidden="true"
2     EnableMaximize="true" EnableCollapse="true" runat="server" EnableResize="true"
3     IsModal="false" CloseAction="HidePostBack" OnClose="Window2_Close" Layout="Fit">
4 </f:Window>

后臺的事件處理代碼：

1 protected void Window2_Close(object sender, WindowCloseEventArgs e)
2 {
3     Alert.ShowInTop("窗體被關閉了。參數：" + (String.IsNullOrEmpty(e.CloseArgument) ? "無" : e.CloseArgument));
4 }

CloseAction無法定義返回參數，所以這里顯示"無"！

點擊頁面上的"隱藏窗體，帶回發參數"，觸發了Close 事件，此時的頁面顯示

這個按鈕的響應腳本是在頁面初始化時注冊的，如下所示（注意參數是如何設進去的）：

1 protected void Page_Load(object sender, EventArgs e)
2 {
3     if (!IsPostBack)
4     {
5         btnHideInClient2.OnClientClick = Window2.GetHidePostBackReference("btnHideInClient2");
6     }
7 }

同樣，對于啟用IFrame的Window控件，其IFrame內按鈕的關閉窗體處理，對應于ActiveWindow的幾個方法：

ActiveWindow.GetHideReference
ActiveWindow.GetHidePostBackReference
ActiveWindow.GetHideRefreshReference

關閉窗體的確認對話框

這個特性可能很多人都不知道，不過存在很強的實用性。

簡單描述：啟用IFrame的Window控件，如果IFrame頁面內任意表單字段發生改變，則在關閉窗體時彈出確認框。

目的是防止用戶在輸入表單內容后，還沒來的及保存，一個誤操作把彈出窗體關了。

頁面初始顯示
在"數字輸入框"內輸入任意值，然后點擊右上角的關閉圖標，彈出確認對話框
清空 "數字輸入框"內的值（也即是還原到其初始狀態），然后點擊右上角的關閉圖標，則直接關閉窗體

上述操作是由Window控件的 EnableConfirmOnClose 屬性控制（默認為false），下面是這個Window實例的標簽定義：

1 <f:Window ID="Window1" Hidden="true" EnableIFrame="true" runat="server" EnableConfirmOnClose="true"
2     EnableMaximize="true" EnableResize="true" Height="450px" Width="800px" Title="窗體一">
3 </f:Window>

對于上述頁面中的"關閉"按鈕，行為和右上角的關閉圖標一致，不過這種一致性也是認為控制的，來看看"關閉"按鈕的腳本：

1 protected void Page_Load(object sender, EventArgs e)
2 {
3     if (!IsPostBack)
4     {
5         btnClose.OnClientClick = ActiveWindow.GetConfirmHideReference();
6     }
7 }

本章小結

本篇文章介紹了三種關閉Window控件的方法（ESC、關閉圖標、自定義），以及三種FineUI定義的處理方式（隱藏、隱藏后回發、隱藏后刷新）。對于IFrame內的關閉按鈕，FineUI提供了ActiveWindow來生成關閉腳本。同時還介紹了一個FineUI內置的屬性 EnableConfirmOnClose ，用來控制是否彈出關閉窗體的確認對話框。