Show main RadAjaxLoadingPanel when clicking on the ok button of a RadWindow

3 posts, 1 answers
  1. Marco
    Marco avatar
    5 posts
    Member since:
    Jul 2014

    Posted 16 Jul 2014 Link to this post

    Hi to all i need some help:

    I have a page with a RadAjaxLoadingPanel that is working propertly when i click on any element on the page that postbak the page, but when i click over a button in a RadWindow, the page makes a complete posback and is not using the RadAjaxLoadingPanel.

    The goal is to use the RadWindow as a confirm window for deleting a element in a RadGrid and i whant that when you click "Ok" the RadWindow close and the  RadAjaxLoadingPanel appears over the RadGrid.

    I have all my HTML Telerik controls warped in a RadAjaxPanel, but for a reasson is not showing the RadAjaxLoadingPanel and is making a complete postback.

    Thanks in advance.

    This is my HTML code:

    <asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
        <telerik:RadAjaxManager ID="RadAjaxManager" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel"></telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel" runat="server" />
        <telerik:RadAjaxPanel ID="AjaxContent" runat="server">
            <%--Place holder for the reserved for the specific html of the page.--%>
            <div class="divTitle h3">
                <%--Page title.--%>
            Data Imports List
            </div>
            <div class="tabWarper">
                <telerik:RadGrid runat="server" ID="RadGridDataImportsList" AllowPaging="True" AllowSorting="true" DataSourceID="GridDataSource" Height="578" OnItemDataBound="RadGridDataImportsList_ItemDataBound">
                    <MasterTableView DataKeyNames="Id, Type" DataSourceID="GridDataSource" AutoGenerateColumns="False" AllowPaging="true"
                        AllowAutomaticInserts="false" ClientDataKeyNames="Id, Type">
                        <Columns>
                            <telerik:GridBoundColumn DataField="Id" HeaderText="Id" SortExpression="Id" UniqueName="Id" Visible="false" MaxLength="100">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="Name" HeaderText="Name" SortExpression="Name" UniqueName="Name" Visible="true" MaxLength="100">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="Description" HeaderText="Description" SortExpression="Description" UniqueName="Description" Visible="true" MaxLength="100">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="Type" HeaderText="Type" SortExpression="Type" UniqueName="Type" Visible="true" MaxLength="100">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings EnableRowHoverStyle="true">
                        <Selecting AllowRowSelect="True"></Selecting>
                        <Scrolling AllowScroll="True" UseStaticHeaders="True" />
                        <ClientEvents OnRowDblClick="OnRowDblClick" />
                    </ClientSettings>
                    <PagerStyle AlwaysVisible="true" Mode="NextPrevAndNumeric" Position="Bottom" PageSizeControlType="RadComboBox"></PagerStyle>
                </telerik:RadGrid>
                <ef:EntityDataSource ID="GridDataSource" runat="server" ContextTypeName="Common.EntityModels.PlatformDB" ConnectionString="name=PlatformDB"
                    DefaultContainerName="PlatformDB" EnableUpdate="False" EnableDelete="False" EnableInsert="False" EntitySetName="DataSourceSystems" />
                <%--Delete confirmation window.--%>
                <telerik:RadWindowManager runat="server" ID="DeleteRadWindowManager" Skin="Metro">
                    <Windows>
                        <telerik:RadWindow ID="DeleteRadWindow" Modal="true" Behaviors="Close, Move" VisibleStatusbar="false" Width="350px" Height="200px" runat="server">
                            <ContentTemplate>
                                <div class="rwDialogPopup">
                                    <div class="rwDialogText">
                                        <asp:Literal ID="lConfirmDeleteMessage" Text="Are you sure you want to delete this item?" runat="server" />
                                    </div>
                                </div>
                                <br />
                                <div class="clr fr">
                                    <telerik:RadButton runat="server" ID="btnDeleteOK" Text="OK" OnClick="Delete_Click" Skin="Metro" CausesValidation="false" />
                                    <telerik:RadButton runat="server" ID="btnDeleteCancel" Text="Cancel" OnClientClicked="closeDeleteConfirm" Skin="Metro" CausesValidation="false" AutoPostBack="false" />
                                </div>
                            </ContentTemplate>
                        </telerik:RadWindow>
                    </Windows>
                </telerik:RadWindowManager>
                <div class="bottomButtons">
                    <asp:Label ID="lblErrorMessage" runat="server" CssClass="text-danger text-message fl" />
                    <asp:Label ID="lblInformationMessage" runat="server" CssClass="text-message fl" />
                    <telerik:RadButton ID="btnDelete" runat="server" OnClientClicked="openDeleteConfirm" Text="Delete" SingleClick="false" Skin="Metro" CssClass="fr" AutoPostBack="false" />
                    <telerik:RadButton ID="btnNew" runat="server" OnClick="New_Click" Text="New" SingleClickText="New" SingleClick="true" Skin="Metro" CssClass="fr" />
                </div>
            </div>
            <script type="text/javascript">
                function OnRowDblClick(sender, eventArgs) {
                    ClikedDataKey = eventArgs._dataKeyValues.Id;
                    window.location.href = 'DataImports.aspx?id=' + ClikedDataKey; // Redirect the page          
                    return;
                }
            </script>
        </telerik:RadAjaxPanel>
    </asp:Content>

    This is the code behind:

        public partial class DataImportsList : DetailBasePage
        {
            // RadAjaxManager setup
            public override void SetAjaxManagerSettings()
            {
                base.AjaxManagerSettings.Add("AjaxContent", new string[] { "AjaxContent" });
            }
        }

    This is the function of the override:

            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);

                //If exists RadAjaxManager in the page, add the page AjaxManagerSettings
                if (this.Master.FindControl("MainContent") != null && this.Master.FindControl("MainContent").FindControl("RadAjaxManager") is RadAjaxManager)
                {
                    var tRadAjaxManager = this.Master.FindControl("MainContent").FindControl("RadAjaxManager") as RadAjaxManager;

                    foreach (var tAjaxManagerSetting in this.AjaxManagerSettings)
                    {
                        // Check if exists the control
                        if (this.Master.FindControl("MainContent").FindControl(tAjaxManagerSetting.Key) != null)
                        {
                            var tAjaxSetting = new AjaxSetting { AjaxControlID = tAjaxManagerSetting.Key };

                            foreach (var tUpdatedControlId in tAjaxManagerSetting.Value)
                            {
                                // Check if exists the control
                                if (this.Master.FindControl("MainContent").FindControl(tUpdatedControlId) != null)
                                    tAjaxSetting.UpdatedControls.Add(new AjaxUpdatedControl { ControlID = tUpdatedControlId, LoadingPanelID = tRadAjaxManager.DefaultLoadingPanelID });
                            }

                            if (tAjaxSetting.UpdatedControls.Count > 0)
                                tRadAjaxManager.AjaxSettings.Add(tAjaxSetting);
                        }
                    }
                }
            }





  2. Answer
    Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 16 Jul 2014 Link to this post

    Hi Marco,

    To use RadWindow's ContentTemplate with AJAX you need to provide explicit AJAX configuration inside it, as shown here: http://www.telerik.com/help/aspnet-ajax/window-ajaxifying.html.

    Also note that it is best to move that RadWindow out of the RadWindowManager when its ContentTemplate is used (see the last point here: http://www.telerik.com/help/aspnet-ajax/window-controls-container.html). A RadWindow can work just fine without a RadWindowManager

    Also, I advise that you make sure you do not nest AJAX settings and RadAjaxPanel, as explained here: http://www.telerik.com/help/aspnet-ajax/ajax-controls-in-ajaxpanel-and-ajaxsettings.html.

    By far, the best advice I can offer is to use the built-in confirmation dialog for the RadGrid: http://www.telerik.com/help/aspnet-ajax/grid-adding-delete-prompt.html. Just add a RadWindowManager to the page, add a GridButtonColumn with CommandName=Delete and set its ConfirmDialogType property to RadWindow. In case you need a special look and feel for the confirm dialog, you can change its template: http://www.telerik.com/help/aspnet-ajax/window-dialogs-changing-dialog-templates.html.

    If this is not an option, you will need an AJAX setting that includes the grid whose initiator is the OK button, so you will need to rewrite the entire AJAX logic (e.g., replace the RadAjaxPanel with ASP:Panel and use that as updated control).


    Regards,

    Marin Bratanov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Marco
    Marco avatar
    5 posts
    Member since:
    Jul 2014

    Posted 16 Jul 2014 in reply to Marin Bratanov Link to this post

    Thanks for your awnser
Back to Top