Wednesday, March 21, 2012

Loading multiple gridviews async

(probably a begginer issue) Here's my problem, I have 7 gridviews on a page... some of them are very long to load it takes about 30 seconds to load the page. I was wondering how to load them all async with the toolkit so that the users could at least see some of the gridviews before all the page gets loaded.

the Gridviews are all linked with a datasource, some SQL some objects.

Anybody have a clue?

thx.

Here is some code to setup what you need...
<%@. Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MultipleGridViewsAsync._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>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"/> <div><asp:UpdatePanel ID="updatePanel1" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:GridView ID="GridView1" runat="server"></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="loadGrids" EventName="click" /></Triggers></asp:UpdatePanel><asp:UpdatePanel ID="updatePanel2" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:GridView ID="GridView2" runat="server"></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="loadGrids" EventName="click" /></Triggers></asp:UpdatePanel><asp:UpdatePanel ID="updatePanel3" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:GridView ID="GridView3" runat="server"></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="loadGrids" EventName="click" /></Triggers></asp:UpdatePanel><asp:UpdatePanel ID="updatePanel4" runat="server" UpdateMode="Conditional"><ContentTemplate><asp:GridView ID="GridView4" runat="server"></asp:GridView></ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="loadGrids" EventName="click" /></Triggers></asp:UpdatePanel> <asp:Button ID="loadGrids" runat="server" Text="Load" /> </div> </form></body></html>

Steps:

1. Put each gridview within its own update panel

2. Create a AsyncPostBackTrigger that goes off a event

3. Create that event using javascript onload to fire the updates... (sorry don't have the code for that)

4. When that even is handled on the code behind bind each datasource to the grid

This way the page loads...

Then asks for the data...

Gets the individual grids...

Renders those grids...

Sorry that I can't help you with step 3, but this should work. Look into using the javascript function :

function __doPostBack(eventTarget, eventArgument)

Hope that works for you


Sorry for the delay of my reply, I was in vacation...

Thanks for the tip but it doesn't solve my issue, what happens is all my gridview loads together after the load of my page... I wanted each gridview to show as soon as they are ready...

any other idea or am I missing somethig obvious?

No comments:

Post a Comment