Updating Window after Long Running Async Operation

3 posts, 0 answers
  1. ColinBowern
    ColinBowern avatar
    51 posts
    Member since:
    Aug 2012

    Posted 20 Jul 2009 Link to this post

    I am looking to use the RadWindow as a progress / operation complete window for bulk operations on items in a RadGrid.  I am running into challenges keeping the window up after the operation and communicating with it without the window closing after the operation is complete.  Here's a small sample of the main page:

    <%@ Page Language="C#" AutoEventWireup="true" Async="true" %> 
     
    <%@ Import Namespace="System.Runtime.Remoting.Messaging" %> 
    <%@ Import Namespace="System.Threading" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="ScriptManager" runat="server">  
            <Scripts> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
        <telerik:RadAjaxManager ID="AjaxManager" runat="server" /> 
        <telerik:RadWindowManager ID="WindowManager" runat="server">  
            <Windows> 
                <telerik:RadWindow ID="Progress" runat="server" Behaviors="Move, Resize" Modal="true" 
                    Title="Operation Progress" VisibleStatusbar="false" /> 
            </Windows> 
        </telerik:RadWindowManager> 
        <telerik:RadCodeBlock ID="CodeBlock" runat="server">  
     
            <script type="text/javascript">  
                function UpdateProgress(success, value)  
                {  
                    GetRadWindowManager().getWindowByName('Progress'); oWnd.get_contentFrame().contentWindow.DisplayResults(success, value);  
                }  
            </script> 
     
        </telerik:RadCodeBlock> 
        <asp:UpdatePanel ID="Panel1" runat="server">  
            <ContentTemplate> 
                <asp:Button ID="Submit" runat="server" Text="Do a Long-Running Operation" OnClick="Submit_Click" 
                    OnClientClick="window.radopen('Progress.aspx', 'Progress');" /> 
            </ContentTemplate> 
            <Triggers> 
                <asp:AsyncPostBackTrigger ControlID="Submit" EventName="Click" /> 
            </Triggers> 
        </asp:UpdatePanel> 
        </form> 
    </body> 
    </html> 
     
    <script runat="server">  
        private void LongRunningMethod(string name)  
        {  
            Thread.Sleep(5000);  
        }  
     
        private delegate void LongRun(string name);  
     
        protected void Submit_Click(object sender, EventArgs e)  
        {  
            PageAsyncTask task = new PageAsyncTask(  
                delegate(Object source, EventArgs ea, AsyncCallback callback, Object state)  
                {  
                    return (new LongRun(LongRunningMethod)).BeginInvoke("Sleep", callback, state);  
                },  
                delegate(IAsyncResult ar)  
                {  
                    ((LongRun)((AsyncResult)ar).AsyncDelegate).EndInvoke(ar);  
     
                    Page.ClientScript.RegisterStartupScript(this.GetType(),  
                        "UpdateProgressDialog",  
                        @"UpdateProgress(true, 'test worked, click close to refresh the page');", true);  
                }, null, null);  
     
            Page.RegisterAsyncTask(task);  
        }  
    </script> 
     
     

    Here is what the progress dialog looks like:

    <%@ Page Language="C#" AutoEventWireup="true" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="ScriptManager" runat="server">  
            <Scripts> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
        <telerik:RadAjaxManager ID="AjaxManager" runat="server" /> 
        <asp:Panel ID="ProcessingRequest" runat="server">  
            Processing Your Request  
            <img alt="Please Wait..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading4.gif") %>' /> 
        </asp:Panel> 
        <asp:Panel ID="Success" runat="server" Visible="false">  
            Operation was a success!  
            <ul> 
                <li>Messages</li> 
            </ul> 
            <href="#">Close</a> 
        </asp:Panel> 
     
        <script type="text/javascript">  
            function GetRadWindow()  
            {  
                var oWindow = null;  
                if (window.radWindow) oWindow = window.radWindow; //Will work in Moz in all cases, including clasic dialog  
                else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; //IE (and Moz as well)  
     
                return oWindow;  
            }  
     
            function DisplayResults(success, value)  
            {  
                // TODO: Hide please wait section  
                if (success)  
                {  
                    // TODO: Show success section  
                    // TODO: Bind results list to bullet list  
                }  
                else  
                {  
                    // TODO: Show failure section  
                    // TODO: Bind results list to bullet list  
                }  
     
                alert('hello ' + value);  
            }  
        </script> 
     
        </form> 
    </body> 
    </html> 
     


    Any thoughts on where to go from here? My first challenge is that GetRadWindowManager() is undefined when the operation tries to complete the callback.
  2. ColinBowern
    ColinBowern avatar
    51 posts
    Member since:
    Aug 2012

    Posted 20 Jul 2009 Link to this post

    After poking at the problem a bit more I decided to change tactics with regards to how the window is used.  Now I just want to use it to display the results of a long running operation.  I have adjusted the sample to include a grid with a command item that kicks off the long running operation.  At the end I want to trigger a modal dialog that pops up to display the results of the operation allowing the user to click Close.  I have the loading panel pop up and render but when the operation returns the script to pop up the results window doesn't run:

    <%@ Page Language="C#" AutoEventWireup="true" Async="true" %> 
     
    <%@ Import Namespace="System.Runtime.Remoting.Messaging" %> 
    <%@ Import Namespace="System.Threading" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="ScriptManager1" runat="server">  
            <Scripts> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
        <telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="server" Skin="Default" /> 
        <telerik:RadAjaxManager ID="AjaxManager" runat="server" DefaultLoadingPanelID="LoadingPanel">  
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="Submit">  
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="SearchResults" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 
        <telerik:RadGrid ID="SearchResults" runat="server">  
            <MasterTableView CommandItemDisplay="Top">  
                <CommandItemTemplate> 
                    <asp:Button ID="Delete" runat="server" Text="This one doesn't work" OnClick="Delete_Click" /> 
                </CommandItemTemplate> 
                <Columns> 
                    <telerik:GridClientSelectColumn UniqueName="Select" /> 
                </Columns> 
            </MasterTableView> 
            <ClientSettings> 
                <Selecting AllowRowSelect="True" /> 
            </ClientSettings> 
        </telerik:RadGrid> 
          
        <asp:Button ID="Delete2" runat="server" Text="This one works" OnClientClick="OpenResultWindow(1, 2); return false;" /> 
        <telerik:RadCodeBlock ID="CodeBlock" runat="server">  
     
            <script type="text/javascript">  
                function OpenResultWindow(success, value)  
                {  
                    var oWnd = $find("<%=ResultsWindow.ClientID%>");  
                    oWnd.setUrl('Progress.aspx');  
                    oWnd.show();  
                }  
                function RefreshPage()  
                {  
                    windowwindow.location.href = window.location.href;  
                }  
            </script> 
     
        </telerik:RadCodeBlock> 
        <telerik:RadWindow ID="ResultsWindow" runat="server" Behaviors="Move, Resize, Close" 
            Modal="true" Title="Operation Results" VisibleStatusbar="false" OnClientClose="RefreshPage" /> 
        </form> 
    </body> 
    </html> 
     
    <script runat="server">  
        protected void Page_Load()  
        {  
            if (!Page.IsPostBack)  
            {  
                SearchResults.DataSource = new string[] { "A", "B", "C" };  
                SearchResults.DataBind();  
            }  
        }  
        private void LongRunningMethod(string name)  
        {  
            Thread.Sleep(5000);  
        }  
     
        private delegate void LongRun(string name);  
     
        protected void Delete_Click(object sender, EventArgs e)  
        {  
            PageAsyncTask task = new PageAsyncTask(  
                delegate(Object source, EventArgs ea, AsyncCallback callback, Object state)  
                {  
                    return (new LongRun(LongRunningMethod)).BeginInvoke("Sleep", callback, state);  
                },  
                delegate(IAsyncResult ar)  
                {  
                    ((LongRun)((AsyncResult)ar).AsyncDelegate).EndInvoke(ar);  
     
                    System.Web.UI.ScriptManager.RegisterStartupScript(this, typeof(Page),  
                        "ReportResults",  
                        String.Format("$find('{0}').open('Progress.aspx');", ResultsWindow.ClientID), true);  
                }, null, null);  
     
            Page.RegisterAsyncTask(task);  
        }  
    </script> 
     
     

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. ColinBowern
    ColinBowern avatar
    51 posts
    Member since:
    Aug 2012

    Posted 20 Jul 2009 Link to this post

    Figured it out. :)

    <%@ Page Language="C#" AutoEventWireup="true" Async="true" %> 
     
    <%@ Import Namespace="System.Runtime.Remoting.Messaging" %> 
    <%@ Import Namespace="System.Threading" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="ScriptManager" runat="server">  
            <Scripts> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
        <telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="server" Skin="Default" /> 
        <telerik:RadAjaxManager ID="AjaxManager" runat="server" DefaultLoadingPanelID="LoadingPanel">  
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="SearchResults">  
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="SearchResults" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 
        <telerik:RadGrid ID="SearchResults" runat="server">  
            <MasterTableView CommandItemDisplay="Top">  
                <CommandItemTemplate> 
                    <asp:Button ID="Delete" runat="server" Text="This works" OnClick="Delete_Click" /> 
                </CommandItemTemplate> 
                <Columns> 
                    <telerik:GridClientSelectColumn UniqueName="Select" /> 
                </Columns> 
            </MasterTableView> 
            <ClientSettings> 
                <Selecting AllowRowSelect="True" /> 
            </ClientSettings> 
        </telerik:RadGrid> 
     
        <script type="text/javascript">  
            function RefreshPage()  
            {  
                windowwindow.location.href = window.location.href;  
            }  
        </script> 
     
        <telerik:RadWindow ID="ResultsWindow" runat="server" Behaviors="Move, Resize, Close" 
            NavigateUrl="Progress.aspx" Modal="true" Title="Operation Results" VisibleStatusbar="false" 
            OnClientClose="RefreshPage" /> 
        </form> 
    </body> 
    </html> 
     
    <script runat="server">  
        protected void Page_Load()  
        {  
            if (!Page.IsPostBack)  
            {  
                SearchResults.DataSource = new string[] { "A", "B", "C" };  
                SearchResults.DataBind();  
            }  
        }  
        private void LongRunningMethod(string name)  
        {  
            Thread.Sleep(5000);  
        }  
     
        private delegate void LongRun(string name);  
     
        protected void Delete_Click(object sender, EventArgs e)  
        {  
            PageAsyncTask task = new PageAsyncTask(  
                delegate(Object source, EventArgs ea, AsyncCallback callback, Object state)  
                {  
                    return (new LongRun(LongRunningMethod)).BeginInvoke("Sleep", callback, state);  
                },  
                delegate(IAsyncResult ar)  
                {  
                    ((LongRun)((AsyncResult)ar).AsyncDelegate).EndInvoke(ar);  
     
                    RadScriptManager.RegisterStartupScript(this, typeof(Page),  
                        "ReportResults",  
                        String.Format("$find('{0}').show();", ResultsWindow.ClientID), true);  
                }, null, null);  
     
            Page.RegisterAsyncTask(task);  
        }  
    </script> 
     
     
Back to Top