Cross-Page PostBack 進階：解決 OnClientClick Confirm 取消導致 PostBack 失效

ASP.NET 2.0 引入 Cross-Page PostBack 讓頁面間傳值更直觀，但搭配 OnClientClick="return confirm(...)" 時，常遇到「點擊確定卻無法發送請求」的詭異現象。本文重現問題、分析原因並提供解決方案。

問題重現

來源頁 Default.aspx：

<asp:TextBox ID="TextBox1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="跨頁提交"
    PostBackUrl="~/Target.aspx"
    OnClientClick="return confirm('Are u sure?')" />

目標頁 Target.aspx.cs：

protected void Page_Load(object sender, EventArgs e)
{
    if (PreviousPage != null)
        Label1.Text = (PreviousPage.FindControl("TextBox1") as TextBox).Text;
}

現象：點擊「取消」正常阻擋，但點擊「確定」頁面不會 PostBack，請求無法送達 Target.aspx。

根本原因分析

OnClientClick 回傳 false 可阻止 PostBack，回傳 true 應繼續。但 Cross-Page PostBack 內部實作依賴 WebForm_DoPostBackWithOptions，其 validation 參數預設為 true。當頁面有驗證控件時，confirm 回傳 true 後，驗證流程可能因時序問題導致 PostBack 中止。

解決方案

方案一：明確指定驗證群組（推薦）

<asp:Button ID="Button1" runat="server" Text="跨頁提交"
    PostBackUrl="~/Target.aspx"
    OnClientClick="return confirm('Are u sure?');"
    ValidationGroup="CrossPageGroup" />

並確保頁面上其他驗證控件同屬此群組或無群組，避免預設驗證干擾。

方案二：使用 JavaScript 手動觸發 PostBack

<asp:Button ID="Button1" runat="server" Text="跨頁提交"
    OnClientClick="if(confirm('Are u sure?')){WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(this.name, '', true, '', 'Target.aspx', false, true));} return false;" />

移除 PostBackUrl，完全由客戶端腳本控制導向與驗證行為。

方案三：改用 Server.Transfer + Session/ViewState 傳值

若不強求 Cross-Page PostBack，Server.Transfer("Target.aspx", true) 保留表單集合，目標頁可直接 Request.Form["TextBox1"] 取值，繞過 PreviousPage 限制。

最佳實踐總結

1. Cross-Page PostBack 搭配客戶端確認時，務必設定 ValidationGroup 隔離驗證邏輯。
2. 複雜客戶端邏輯建議改用 WebForm_DoPostBackWithOptions 手動控制。
3. 考慮改用 Server.Transfer 或 Response.Redirect + QueryString/Session 傳值，架構更清晰。