Asynchronously bind multiple repeaters on page laod

**davebat** · Jun 11th, 2012, 04:41 AM

Hi,

I have four repeaters, that are al independant to each other. They all bind via web services on page load and then display the results.

There is a noticeable delay however and I would like to know how to achieve the following if possible.

On page load I want to begin asynchrously binding the repeaters so that as soon as the first one is bound, its result display and then the next starts binding.

I looked at update panels but from what I have read they do not have a page load trigger.

Could anyone help?

Ta Dave

**Mickroy** · Jun 11th, 2012, 09:37 AM

Hi, I haven't done much WebForms in the last few years but was interested so had a play.

There may be many solutions, but the following works for me & is simple. The panels can be loaded by calling the __doPostBack function in JavaScript using the client name of the panel. The script loads each panel 2 seconds apart in JQuery document ready. If you're not using JQuery try window load or something.

I'd imagine by using the Sys.WebForms.PageRequestManager class (http://msdn.microsoft.com/en-us/library/bb311028) of the MS AJAX client library, you will be able to find out what panels you have, what has been updated, and what hasn't. If you can't work it out from here I can take a closer look.

Code:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="WebApplication2.WebForm2" %>

<!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 id="Head1" runat="server">
    <title></title>
    <script src="jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            //Load panel 1
            setTimeout(function () {
                __doPostBack('<%= UpdatePanel1.UniqueID %>', '');
            }, 2000);

            //Load panel 2
            setTimeout(function () {
                __doPostBack('<%= UpdatePanel2.UniqueID %>', '');
            }, 4000);

            //Load panel 3
            setTimeout(function () {
                __doPostBack('<%= UpdatePanel3.UniqueID %>', '');
            }, 6000);
        });
       
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>

        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <%= "UpdatePanel1 - " & Date.Now.ToString()%>
            </ContentTemplate>
        </asp:UpdatePanel>

        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <%= "UpdatePanel2 - " & Date.Now.ToString()%>
            </ContentTemplate>
        </asp:UpdatePanel>

        <asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <%= "UpdatePanel3 - " & Date.Now.ToString()%>
            </ContentTemplate>
        </asp:UpdatePanel>

        <asp:Label ID="Label4" runat="server">
            <%= "Form - " & Date.Now.ToString()%>
        </asp:Label>

    </div>
    </form>
</body>
</html>

**Mickroy** · Jun 11th, 2012, 09:40 AM

Oh yeah, using this approach you can do stuff server side like this:

Code:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        Dim eventTarget As String = Page.Request.Params("__EVENTTARGET")

        If eventTarget = "UpdatePanel1" Then
            'Do stuff with panel 1
        ElseIf eventTarget = "UpdatePanel2" Then
            'Do stuff with panel 2
        ElseIf eventTarget = "UpdatePanel3" Then
            'Do stuff with panel 3
        End If

    End Sub

**davebat** · Jun 12th, 2012, 02:58 AM

Thanks, I found a good solution using javascript to do the button click

http://jakkaj.wordpress.com/tag/updatepanel/

Thread: Asynchronously bind multiple repeaters on page laod

Thread Tools

Display

Asynchronously bind multiple repeaters on page laod

Re: Asynchronously bind multiple repeaters on page laod

Re: Asynchronously bind multiple repeaters on page laod

Re: Asynchronously bind multiple repeaters on page laod

Posting Permissions