New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Confirm Dialog Integration

Confirm postback from a button
Confirm postback from a link button
Confirm postback from within an Update Panel
This example shows how to use RadConfirm to simulate the blocking of the execution thread that can be achieved via the browser's confirm dialog. As this is generally not possible via JavaScript this approach has certain limitations and peculiarities:
  • It can mostly be used for elements that perform a postback, so that we can cancel it, show the confirm and then initiate it again if need be
  • To call __doPostBack("", ""); you need to provide the UniqueID of the element as the first parameter
  • The link button, for example, does not provide its UniqueID (i.e. it does not have the name property like the rest of the buttons) and thus __doPostBack() can work with its id (in a simpler environment). Another approach is to evaluate its href property, as it renders a call to __doPostBack() with the correct arguments - i.e. call eval(button.href); instead. This is most useful in a databound control where multiple instances of the button can be found.
  • It cannot always be used directly on controls that perform an AJAX request - you may need to perform the AJAX request manually via the RadAjaxManager and thus set the AjaxSettings accordingly
  • It cannot be used in code, such as if(confirm("Are you sure?")){} because browser execution thread cannot be blocked by JavaScript.
  • This cannot be used on the server, as server code is separate from JavaScript. If a confirm is called from the code-behind it will be shown on the client once all server-side functionality has completed and the response is sent to the client
The general concept is that the functionality is split in two with the things that need to be done after the user input being placed in the callback function. What is important here is that this functionality must be achievable via JavaScript- either the functionality itself, or continuing the postback to let the server process the results.
This approach can also be extended for the RadAlert and RadConfirm dialogs, as they also offer callback functions.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
  • styles.css
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.Window.ConfirmServerClicks.DefaultCS" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="stylesheet" type="text/css" />
    <script src="scripts.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadFormDecorator RenderMode="Lightweight" ID="theFormDecorator" runat="server" DecoratedControls="Buttons" />
    <telerik:RadWindowManager RenderMode="Lightweight" runat="server" ID="RadWindowManager1">
    </telerik:RadWindowManager>
    <div class="demo-container size-medium no-bg">
        <div class="btnOuter btnBottomSpace">
            <div class="btnInner ">
                <img src="images/selectIcon.gif" alt="" />
                <span class="imgLabel">Confirm postback from a button</span>
                <div class="btnWrap btnGreen">
                    <asp:Button ID="Button1" Text="Button" runat="server" OnClick="Button1_Click" OnClientClick="confirmAspButton(this); return false;">
                    </asp:Button>
                </div>
            </div>
        </div>
        <div class="btnOuter btnBottomSpace">
            <div class="btnInner">
                <img src="images/selectIcon.gif" alt="" />
                <span class="imgLabel">Confirm postback from a link button</span>
                <div class="btnWrap btnCeramic">
                    <asp:LinkButton ID="Linkbutton2" Text="Link Button" runat="server" OnClick="Linkbutton1_Click"
                        OnClientClick="confirmLinkButton(this); return false;"></asp:LinkButton>
                </div>
            </div>
        </div>
        <div class="btnOuter">
            <div class="btnInner">
                <img src="images/selectIcon.gif" alt="" />
                <span class="imgLabel">Confirm postback from within an Update Panel</span>
                <div class="btnWrap btnBlue">
                    <asp:UpdatePanel ID="Updatepanel1" runat="server" UpdateMode="Conditional">
                        <ContentTemplate>
                            <asp:Button ID="Button3" Text="Button" OnClientClick="confirmAspUpdatePanelPostback(this); return false;"
                                OnClick="Button3_Click" runat="server"></asp:Button>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </div>
            </div>
        </div>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance