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

ajaxRequest HELP NEEDED

6 Answers 101 Views

Ajax

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

loai taha asked on 07 Jan 2010, 02:11 PM

Telerik guys,

Please note the below,

I posted a thread asking for help two times before (Thread 1 and Thread 2) and couldn't find a solution yet
I read 70% of the 264 threads related to ajaxRequest issues and couldn't find a solution
I want to buy the new ASP.NET AJAX controls, but to be honest, I'm reconsidering doing that because I still can't implement the needed scenarios

What I'm looking for?

I need to implement the below scenario, and please, please, please, provide sample codes if you want to help.

1- User open page
2- Page sends an Ajax request after 5 seconds to server
3- Server receives the request and updates the first section on page through AJAX
4- First section is updated successfully, once done a new AJAX request is sent to server to update the next section
5- Server receives the request and updates the second section
6- Update the rest of sections through recurring the steps 3 to 4

I was able to implement the above scenario using Rad AJAX Panel in few hours, however I need to implement it using Rad AJAX Manager for better performance as most of you in here advised. It has been 4 days now and I'm stuck with this scenario, therefore your help is highly appreciated.

On a separate note, I reached a point where the above scenario works fine but with the below issues,

RAD Loading Panel does not show, yet data displayed correctly
RAD Loading Panel shows but no data to display
Data display correctly and Loading panel shows but in the wrong places/order

I already provided my code in previous threads, all what I ask for is a clear example for the above scenario in any language.

Thanks for your help in advance

Regards,

6 Answers, 1 is accepted

answered on 08 Jan 2010, 03:09 AM

What is it that's being updated? Panels, Grids...?

If you want performance perhaps this might work
1) jQuery document.ready function which calls a setTimeout to wait 5 seconds
2) Then it'll set a value in a RadXmlHttpPanel, which then calls the other panel on ResponseEnd, and repeat

If your updates\controls work in the RadXmlHttpPanel scenario it'd be much faster than a standard ajax callback because you wouldn't need to run through the entire page lifecycle...and if you used webservices to populate the data you wouldn't need to postback at all.

I guess the same principle could be applied to call the ajax manager clientside methods as well if an XmlHttpPanel can't be used.

I submitted the demo project\sample to the code library, maybe it'll get approved...maybe it wont :) I cant seem to attach anything other than images to this.
http://www.telerik.com/community/code-library/aspnet-ajax/ajax.aspx

Accepted

answered on 10 Jan 2010, 04:02 PM

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %> 
        
            <!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"> 
        
                <title></title> 
        
                <link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
        
                <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <!-- Include jQuery --> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" 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:RadFormDecorator ID="decorator" runat="server" DecoratedControls="Fieldset" Skin="Windows7" /> <!-- Only required to be fancy --> 
        
                <div> 
        
                    <!-- Show the time the page loads --> 
        
                    <asp:Label ID="startdate" runat="server" CssClass="item" /> 
        
                    <!-- First Panel to be Updated -->    
        
                    <fieldset> 
        
                        <legend>Panel 1</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel1" runat="server" OnServiceRequest="UpdatePanel1_ServiceRequest" BackColor="#e6e6e6" OnClientResponseEnded="updateSecondPanel" CssClass="item">     
        
                            <asp:Label ID="date1" runat="server" /> 
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <!-- Second Panel to be Updated -->    
        
                    <fieldset> 
        
                        <legend>Panel 2</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel2" runat="server" BackColor="#c00300" ForeColor="Wheat" OnServiceRequest="UpdatePanel2_ServiceRequest" OnClientResponseEnded="updateOtherPanels"  CssClass="item" > 
        
                            <asp:Label ID="date2" runat="server" Text="" /> 
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <!-- REST OF CONTENT --> 
        
                    <fieldset> 
        
                        <legend>Other Content</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel3" runat="server" BackColor="#f96433" ForeColor="Wheat" OnServiceRequest="UpdateRest_ServiceRequest" CssClass="item" > 
        
                            <asp:Label ID="date3" runat="server" Text="" /> 
        
                            <asp:Label ID="date4" runat="server" Text="" /> 
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <telerik:RadCodeBlock runat="server"> 
        
                        <script type="text/javascript"> 
        
                            //5 Seconds passed, this gets called from document.ready 
        
                            function updatepanel1() { 
        
                                var panel = $find('<%= updatePanel1.ClientID %>'); 
        
                                panel.set_value('1'); 
        
                            } 
        
                            //First panel finishes, here we are 
        
                            function updateSecondPanel(sender, args) { 
        
                                var panel = $find('<%= updatePanel2.ClientID %>'); 
        
                                panel.set_value('2'); 
        
                            } 
        
                            //Panel 2 finished update, we're updating the other controls now 
        
                            function updateOtherPanels(sender, args) { 
        
                                var panel3 = $find('<%= updatePanel3.ClientID %>'); 
        
                                panel3.set_value('2'); 
        
                            }  
        
                        </script> 
        
                     </telerik:RadCodeBlock> 
        
                     <script type="text/javascript"> 
        
                         //START THE UPDATE ON PAGE LOAD 
        
                         $telerik.$(document).ready(function () { 
        
                             setTimeout("updatepanel1()", 5000); 
        
                         }); 
        
                    </script> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

    
            using System; 
        
            using System.Web; 
        
            using System.Web.UI; 
        
            using System.Web.UI.WebControls; 
        
            using System.Data; 
        
            using System.Configuration; 
        
            using System.Web.Security; 
        
            using System.Web.UI.WebControls.WebParts; 
        
            using System.Web.UI.HtmlControls; 
        
            using Telerik.Web.UI; 
        
            public partial class Default : System.Web.UI.Page  
        
            { 
        
                protected void Page_Load(object sender, EventArgs e) 
        
                { 
        
                    startdate.Text = "Started: " + DateTime.Now.ToString(); 
        
                } 
        
                protected void UpdatePanel1_ServiceRequest(object sender, RadXmlHttpPanelEventArgs e) { 
        
                    date1.Text = DateTime.Now.ToString(); 
        
                } 
        
                protected void UpdatePanel2_ServiceRequest(object sender, RadXmlHttpPanelEventArgs e) { 
        
                    date2.Text = DateTime.Now.ToString(); 
        
                } 
        
                protected void UpdateRest_ServiceRequest(object sender, RadXmlHttpPanelEventArgs e) { 
        
                    date3.Text = DateTime.Now.ToString(); 
        
                    date4.Text = DateTime.Now.ToString(); 
        
                } 
        
            }

## WEBSERVICE ##

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultWebService.aspx.cs" Inherits="Default" %> 
        
            <!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"> 
        
                <title></title> 
        
                <link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
        
                <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <!-- Include jQuery --> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" 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:RadFormDecorator ID="decorator" runat="server" DecoratedControls="Fieldset" Skin="Windows7" /> 
        
                <div> 
        
                    <!-- Show the time the page loads --> 
        
                    <asp:Label ID="startdate" runat="server" CssClass="item" /> 
        
                    <!-- First Panel to be Updated -->    
        
                    <fieldset> 
        
                        <legend>Panel 1</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel1" runat="server" WebMethodName="Update1" WebMethodPath="WebService.asmx" BackColor="#e6e6e6" OnClientResponseEnded="updateSecondPanel" CssClass="item">     
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <!-- Second Panel to be Updated -->    
        
                    <fieldset> 
        
                        <legend>Panel 2</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel2" runat="server" BackColor="#c00300" ForeColor="Wheat" WebMethodName="Update2" WebMethodPath="WebService.asmx" OnClientResponseEnded="updateOtherPanels"  CssClass="item" > 
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <!-- REST OF CONTENT --> 
        
                    <fieldset> 
        
                        <legend>Other Content</legend> 
        
                        <telerik:RadXmlHttpPanel ID="updatePanel3" runat="server" BackColor="#f96433" ForeColor="Wheat" WebMethodName="Update3" WebMethodPath="WebService.asmx" CssClass="item" > 
        
                        </telerik:RadXmlHttpPanel> 
        
                    </fieldset> 
        
                    <telerik:RadCodeBlock runat="server"> 
        
                        <script type="text/javascript"> 
        
                            //5 Seconds passed, this gets called from document.ready 
        
                            function updatepanel1() { 
        
                                var panel = $find('<%= updatePanel1.ClientID %>'); 
        
                                panel.set_value('1'); 
        
                            } 
        
                            //First panel finishes, here we are 
        
                            function updateSecondPanel(sender, args) { 
        
                                var panel = $find('<%= updatePanel2.ClientID %>'); 
        
                                panel.set_value('2'); 
        
                            } 
        
                            //Panel 2 finished update, we're updating the other controls now 
        
                            function updateOtherPanels(sender, args) { 
        
                                var panel3 = $find('<%= updatePanel3.ClientID %>'); 
        
                                panel3.set_value('2'); 
        
                            }  
        
                        </script> 
        
                     </telerik:RadCodeBlock> 
        
                     <script type="text/javascript"> 
        
                         //START THE UPDATE ON PAGE LOAD 
        
                         $telerik.$(document).ready(function () { 
        
                             setTimeout("updatepanel1()", 5000); 
        
                         }); 
        
                    </script> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

    
            using System; 
        
            using System.Web; 
        
            using System.Web.UI; 
        
            using System.Web.UI.WebControls; 
        
            using System.Data; 
        
            using System.Configuration; 
        
            using System.Web.Security; 
        
            using System.Web.UI.WebControls.WebParts; 
        
            using System.Web.UI.HtmlControls; 
        
            using Telerik.Web.UI; 
        
            public partial class Default : System.Web.UI.Page  
        
            { 
        
                protected void Page_Load(object sender, EventArgs e) 
        
                { 
        
                    startdate.Text = "Started: " + DateTime.Now.ToString(); 
        
                } 
        
            }

    
            <%@ WebService Language="C#" Class="WebService" %> 
        
            using System; 
        
            using System.Web; 
        
            using System.Web.Services; 
        
            using System.Web.Services.Protocols; 
        
            [WebService(Namespace = "http://tempuri.org/")] 
        
            [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
        
            // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.  
        
            [System.Web.Script.Services.ScriptService] 
        
            public class WebService  : System.Web.Services.WebService { 
        
                [WebMethod(CacheDuration=0)] 
        
                public string Update1(object context) { 
        
                    return DateTime.Now.ToString(); 
        
                } 
        
                [WebMethod(CacheDuration = 0)] 
        
                public string Update2(object context) { 
        
                    return DateTime.Now.ToString(); 
        
                } 
        
                [WebMethod(CacheDuration = 0)] 
        
                public string Update3(object context) { 
        
                    return DateTime.Now.ToString(); 
        
                } 
        
            }

answered on 13 Jan 2010, 09:04 AM

app-code-chainxmlhttppanels.zip

Hi Steve,

Thank you for sharing your ideas with the community.

I have carefully examined the project you have submitted to our code library and noticed that we have a very similar online demo that follows your scenario - chain RadXmlHttpPanels after page load. Here is a link to the online demo: http://demos.telerik.com/aspnet-ajax/xmlhttppanel/examples/default/defaultcs.aspx

In the online demo there are three RadXmlHttpPanel controls. Two of them show the same information, customers from a given country, but use different ways to update their content (Callback and WebService). The third one shows information about a specific customer. On page load the country customers are loaded within the two panels and the information in the third panel is loaded by initializing a partial page load from one of the previous panels (when the response is finished).

This being said, I will remove the source code from our Code Library and attach it to the thread. This way way the people will have access to both our online demo and your project.

Greetings,

Pero
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

ajaxRequest HELP NEEDED

6 Answers, 1 is accepted