asp.net ajax Update Panel/ Update Progress with Datalist

Hi there,

I have a simple datalist, however i will be loading in alot of images into them, so when during the page_load section, the images will take awhile to load. Instead of allowing my visitors to see the images loading 1 by 1, i want to set something like a buffer or wait time, so that during this period my visitors will see the loading words or an gif animation using ajax update panel and update progress control. And once all the images are loading it will show the full album right away.

However the main problem is that my datalist is loading in page_load time. So i am not sure what to fill up at this line of code to make it work:
<Triggers>
            <asp:AsyncPostBackTrigger  />
 </Triggers>

they require a contolid and event id, how should i put in the page_load event here?

Am i doing this the right way? Can i use ajax controls in this example? need some advice thanks.

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        
        <Triggers> 
            <asp:AsyncPostBackTrigger  />
           
        </Triggers>
 
        <ContentTemplate>    
           
            <asp:DataList ID="dlPhotos" runat="server" RepeatColumns="3" RepeatDirection="Horizontal" HorizontalAlign="Left" CellPadding="5" CellSpacing="1">       
                <ItemTemplate>
                    <asp:ImageButton ID="imgItem" runat="server" ImageUrl='<%# String.Concat("~/photos/", Eval("imagePath")) %>' PostBackUrl='<%# "PhotoGallery.aspx?albumId="+DataBinder.Eval(Container.DataItem, "albumId")%>' />
                    <br />
                    <asp:Label ID="lblAlbumName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "albumName") %>'></asp:Label>
                    <br />
                    <asp:Label ID="lblalbumId" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "albumId") %>' Visible="False"></asp:Label>
                </ItemTemplate>
            </asp:DataList>
            
        </ContentTemplate>
     </asp:UpdatePanel>
 
     <asp:UpdateProgress ID="UpdateProgress1" AssociatedUpdatePanelID="UpdatePanel1" runat="server">
        <ProgressTemplate>Please wait... Loading Datalist...</ProgressTemplate> 
    </asp:UpdateProgress> 
 
CODE BEHIND
------------
 
protected void Page_Load(object sender, EventArgs e)
    {
        PopulateAlbum();
    }
 
    private void PopulateAlbum()
    {
        if (Request.QueryString["categoryId"] != null)
        {
            int categoryId = Convert.ToInt32(Request.QueryString["categoryId"]);
            PagedDataSource objPds = new PagedDataSource();
            DataView dv = new DataView(AlbumAccess.GetAlbumAllViaCategoryId(categoryId));
            objPds.DataSource = dv;
 
            dlPhotos.DataSource = objPds;
            dlPhotos.DataBind();
        }         
    }

Select allOpen in new window