ASP.NET 2.0 數據教程（二十二）：為刪除功能添加客戶端確認對話框

返回 ASP.NET 2.0 數據教程目錄

導言

前面教程已見使用應用程式架構、ObjectDataSource、提供增刪改功能的資料 Web 控制項。已實作的刪除介面包含刪除按鈕，點擊觸發資料回傳呼叫 ObjectDataSource 的 Delete() 方法，進而呼叫 BLL 對應方法、DAL、至資料庫 DELETE 陳述式。

雖介面讓用戶透過 GridView、DetailsView、FormView 刪除記錄，但點擊刪除按鈕時缺少提示。若用戶本想點編輯卻誤點刪除，原本會更新的記錄將被刪除。為避免此事，本教程為點擊刪除按鈕添加客戶端提醒視窗。

JavaScript confirm() 方法

confirm(string) 於模態視窗顯示字串參數文字，視窗含「確定」與「取消」兩按鈕（見圖 1）。點擊不同按鈕回傳布林值（確定回傳 true，取消回傳 false）。

圖 1：JavaScript 的 confirm(string) 方法顯示一個模態的、客戶端的視窗

運作機制

表單提交過程中，若客戶端事件處理器回傳 false，表單取消提交。利用此特性，在刪除按鈕客戶端 onClick 事件處理器呼叫 confirm("確定要刪除此產品嗎？") 回傳布林值。用戶點取消回傳 false 取消提交，無回傳前提下產品不被刪除；點確定回傳繼續並刪除產品。詳細參考 使用 JavaScript 的 confirm() 方法控制表單提交。

添加客戶端腳本時，使用模板與 CommandField 相比有細微差別。本教程同時探討 FormView 與 GridView 範例。

注意： 使用客戶端確認假設用戶瀏覽器支援並啟用 JavaScript。若不滿足，點擊刪除按鈕將立即回傳不顯示確認視窗。

第一步：建立支援刪除的 FormView

在 EditInsertDelete 目錄下建立 ConfirmationOnDelete.aspx，加入 FormView 並繫結 ObjectDataSource，資料來自 ProductsBLL 的 GetProducts()。Delete() 繫結至 ProductsBLL 的 DeleteProduct(productID)。確保 INSERT、UPDATE 下拉方塊為 (None)。最後 FormView 屬性視窗勾選 Enable Paging。

產生宣告式 ObjectDataSource：

<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" DeleteMethod="DeleteProduct"
  OldValuesParameterFormatString="original_{0}" SelectMethod="GetProducts" TypeName="ProductsBLL">
  <DeleteParameters>
    <asp:Parameter Name="productID" Type="Int32" />
  </DeleteParameters>
</asp:ObjectDataSource>