This is a migrated thread and some comments may be shown as answers.

Updating Window after Long Running Async Operation

2 Answers 95 Views
Window
This is a migrated thread and some comments may be shown as answers.
ColinBowern
Top achievements
Rank 1
ColinBowern asked on 21 Jul 2009, 02:34 AM
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 Answers, 1 is accepted

Sort by
0
ColinBowern
Top achievements
Rank 1
answered on 21 Jul 2009, 03:22 AM
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> 
 
 

0
ColinBowern
Top achievements
Rank 1
answered on 21 Jul 2009, 03:45 AM
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> 
 
 
Tags
Window
Asked by
ColinBowern
Top achievements
Rank 1
Answers by
ColinBowern
Top achievements
Rank 1
Share this question
or