Need whelp with simple callback

4 posts, 1 answers
  1. Mojo
    Mojo avatar
    10 posts
    Member since:
    Oct 2006

    Posted 08 Jul 2009 Link to this post

    Hi,

    I'm trying to make a simple webpage that will update time every second using the new XmlHttpPanel callback. I'm a noob on Javascript, so I ask for your help.

    Here's my markup:

    <script type="text/javascript"
        function UpdateTime(sender, args) { 
            var panel = $find("<%=RadXmlHttpPanel1.ClientID%>"); 
            panel.set_value(); 
            window.setInterval(UpdateTime, 1000); 
        } 
     
    </script> 
     
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"
    </telerik:RadAjaxLoadingPanel> 
    <telerik:RadXmlHttpPanel ID="RadXmlHttpPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" 
        Value="test" OnServiceRequest="XmlHttpPanel_ServiceRequest"
        <asp:PlaceHolder ID="ph" runat="server"></asp:PlaceHolder> 
    </telerik:RadXmlHttpPanel> 
     
    <script type="text/javascript"
        UpdateTime; 
    </script> 
     

    and here's my codebehind:

        Protected Sub XmlHttpPanel_ServiceRequest(ByVal sender As Object, ByVal e As RadXmlHttpPanelEventArgs) 
            Dim val As String = e.Value 
            ph.Controls.Add(New LiteralControl("<font color='#000000'>" & Now.ToString & "</font>")) 
        End Sub 

    The time is updated on pagerefresh, but I can't figure out how to make it update automatically every second.

    How do I do that and what is the best approach?

    Thanks!
    Morten
  2. Answer
    Pero
    Admin
    Pero avatar
    1156 posts

    Posted 10 Jul 2009 Link to this post

    Hi Morten,

    I have modified your sample project (pasted below) and now the time is updated on every callback. Two issues were causing the application to behave unexpectedly:
    1. You were trying to call the UpdateTime method without arguments (only by specifying its name). Methods in JavaScript are called by specifying the name of the method together with its arguments (e.g. UpdateTime()).
    2. The JavaScript source code in the <script> tag is executed when the application is initialized, and if you try to execute (call) the UpdateTime method there, you will get JavaScript errors because you are trying to use the RadXmlHttpPanel1 client object when it has not been initialized yet. So, the UpdateMethod is called in the pageLoad() method instead. The pageLoad() method is executed when the page is loaded and after all controls have been initialized.

    <%@ 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"> 
    <html xmlns="http://www.w3.org/1999/xhtml"
    <head runat="server"
        <title></title
    </head> 
    <body> 
        <form id="form1" runat="server"
        <asp:ScriptManager ID="ScriptManager1" runat="server"
        </asp:ScriptManager> 
        <div> 
            <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"
            </telerik:RadAjaxLoadingPanel> 
            <telerik:RadXmlHttpPanel ID="RadXmlHttpPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" 
                OnServiceRequest="XmlHttpPanel_ServiceRequest"
                <asp:PlaceHolder ID="ph" runat="server"></asp:PlaceHolder> 
            </telerik:RadXmlHttpPanel> 
        </div> 
     
        <script type="text/javascript"
            function UpdateTime() 
            { 
                var panel = $find("<%=RadXmlHttpPanel1.ClientID%>"); 
                panel.set_value(); 
                window.setInterval(UpdateTime, 5000); 
     
            } 
     
            function pageLoad() 
            { 
                UpdateTime(); 
            } 
        </script> 
     
        </form> 
    </body> 
    </html> 



    Sincerely yours,
    Pero
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Greg
    Greg avatar
    13 posts
    Member since:
    Sep 2005

    Posted 01 Sep 2009 Link to this post

    I tried this exact example and was not able to get the time to display.. ever!  not on load or any subsequent post back. I've also tried the sample code from the demos but again no luck. The code seems to work but the objects although updated never render with new values.

    Is there some secret magical setting somewhere?
  5. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 04 Sep 2009 Link to this post

    Hi Gregory,

    I tested this example a couple of times and the Literal control that is added on every service request is updated and rendered with the respective value. You can see this on the following video captured while running the example.

    There is another project attached to this thread that uses a button click to execute a client side function that causes the XmlHttpPanel to update its content every 7 seconds. Please test it and let us know if the content changes are rendered on the screen.

    If you still have problems with the example, please put together a simple running project where we can reproduce your behavior, and sent it back. Also, can you please provide more information about your project setup and the logic you are using?


    Sincerely yours,
    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.
Back to Top