RadButton + RadConfirm + AJAX

2 posts, 0 answers
  1. nowickim
    nowickim avatar
    16 posts
    Member since:
    Aug 2007

    Posted 10 Jun 2011 Link to this post

    I know there are examples that show how to add a confirmation popup to RadButton, and there are examples that show how to add a RadConfirm to a RadButton.  But what about RadButton with a RadConfirm in an AJAX scenario??  I'm using RadButton to ajaxify an ASP panel and I want a confirmation to happen before the server-side code fires, but I can't figure out how to make that happen.
  2. Slav
    Admin
    Slav avatar
    1355 posts

    Posted 13 Jun 2011 Link to this post

    Hello,

    A possible solution is to use the examples for attaching RadConfirm to RadButton Control and also to AJAX enable the RadButton. RadAjaxManager is very convenient and can be used to ajaxify all controls that work with postback and with it you can update multiple page elements, specifying which should initiate AJAX requests and which should be updated. This makes it a good choice in the current situation. Here you will find helpful information about RadAjaxManager.

    In this case, as seen in the sample, RadButton initiates AJAX request and the Panel Control is updated:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main.aspx.cs" Inherits="Main" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager" runat="server">
            </asp:ScriptManager>
            <telerik:RadAjaxManager ID="RadAjaxManager" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadButton">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="Panel" UpdatePanelRenderMode="Block" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
     
            <script type="text/javascript">
                function RadConfirm(sender, args) {
                    var callBackFunction = Function.createDelegate(sender, function (shouldSubmit) {
                        if (shouldSubmit) {
                            this.click();
                        }
                    });
                     
                    var text = "Are you sure you want to submit the page?";
                    radconfirm(text, callBackFunction, 300, 100, null, "RadConfirm");
                    args.set_cancel(true);
                }
            </script>
            <telerik:RadWindowManager ID="RadWindowManager" runat="server">
            </telerik:RadWindowManager>
     
            <telerik:RadButton ID="RadButton" runat="server" Text="RadButton" OnClientClicking="RadConfirm" onclick="RadButton_Click" >
            </telerik:RadButton>
             
            <asp:Panel ID="Panel" runat="server">
                <asp:Label ID="Label" runat="server" Text=""></asp:Label>
            </asp:Panel>
        </div>
        </form>
    </body>
    </html>

    The server-side event handler RadButton_Click generates content for the Panel Control:
    protected void RadButton_Click(object sender, EventArgs e)
    {
        (Panel.FindControl("Label") as Label).Text = "Content updated on " + DateTime.Now.ToString();
    }

    For convenience I have attached sample project demonstrating the solution.

    All the best,
    Slav
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top