How to use ConfirmButtonExtender in asp.net ajax

ConfirmButtonExtender in asp.net ajax
ConfirmButtonExtender is an asp.net ajax control toolkit's extender control. ConfirmButtonExtender control catches clicks on a button or any instance of a type derived from button. after catching the clicks from button instance ConfirmButtonExtender display a message to the user.

popup message box have three parts those are a question (message), an OK button and and a Cancel button. typically popup message ask user that they really want to do the task or not. if they click the OK button from the popup message box that ConfirmButtonExtender control generated then the button or link functions normally. if user click Cancel button from message box then the click is trapped and the button will not not perform its default submit behavior.

ConfirmButtonExtender control's have the following built in properties those are TargetControlID, ConfirmText, OnClientCancel, ConfirmOnFormSubmit and DisplayModalPopupID.

TargetControlID property specify the control (button or link) which need a confirmation before functions normally. ConfirmText property set a question (text message) in confirm message box to ask user final decision.

OnClientCancel property allow us to execute a client side script when the Cancel button is clicked in confirm dialog. ConfirmOnFormSubmit property ensure that confirm should be shown only after all asp.net validators pass. DisplayModalPopupID property optionally indicate a ModalPopup control to use for displaying the confirmation dialog.

the following asp.net ajax c# example code demonstrate us how can we use ConfirmButtonExtender control. in this code we created a RadioButtonList with items and a Button control. if an user select an item from radiobuttonlist and click the delete button then a confirm dialog appears on client browser. if user click the OK button from confirm dialog box then selected item will be deleted from radiobuttonlist and if user click Cancel button then radiobuttonlist item will not be deleted. a ConFirmButtonExtender control display the confirm dialog box when user click the delete button.
UsingConfirmButtonExtender.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html>

<script runat="server">
    protected void Button1_Click(object sender, EventArgs e)
    {
        RadioButtonList1.Items.Remove(RadioButtonList1.SelectedItem);
    }    
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>How to use ConfirmButtonExtender in asp.net ajax</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="color:DeepPink; font-style:italic;">Ajax Control Toolkit Example: Using ConfirmButtonExtender</h2>
        <hr width="600" align="left" color="Pink" />
        <asp:ScriptManager 
            ID="ScriptManager1"
            runat="server"
            >
        </asp:ScriptManager>
        <cc1:ConfirmButtonExtender 
            ID="ConfirmButtonExtender1"
            runat="server"
            TargetControlID="Button1"
            ConfirmText="Are you sure you wanted to delete this color?"
            >
        </cc1:ConfirmButtonExtender>
        <asp:RadioButtonList 
            ID="RadioButtonList1"
            runat="server"
            ForeColor="Snow"
            BackColor="Crimson"
            BorderColor="Orange"
            BorderWidth="1"
            RepeatColumns="2"
            Width="500"
            >
            <asp:ListItem Selected="True">Crimson</asp:ListItem>
            <asp:ListItem>LawnGreen</asp:ListItem>
            <asp:ListItem>DeepPink</asp:ListItem>
            <asp:ListItem>HotPink</asp:ListItem>
            <asp:ListItem>LightPink</asp:ListItem>
            <asp:ListItem>Salmon</asp:ListItem>
            <asp:ListItem>DarkSeaGreen</asp:ListItem>
        </asp:RadioButtonList>
        <br />
        <asp:Button 
            ID="Button1"
            runat="server"
            Text="Delete Selected Color"
            Font-Bold="true"
            ForeColor="DodgerBlue"
            Height="40"
            OnClick="Button1_Click"
            />
    </div>
    </form>
</body>
</html>
Related asp.net ajax examples