I want to show a loading indicator in my asp.net webpage while my gridview is being filled with data
This is part of my aspx page
<script type="text/javascript" src="Scripts/jsUpdateProgress.js"></script>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Panel ID="panelUpdateProgress" runat="server" CssClass="updateProgress">
<asp:UpdateProgress ID="UpdateProg1" DisplayAfter="0" runat="server">
<ProgressTemplate>
<div style="position: relative; top: 30%; text-align: center;">
<img src="Styles/images/loading.gif" style="vertical-align: middle" alt="Processing" />
Loading...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalProgress" runat="server" TargetControlID="panelUpdateProgress"
BackgroundCssClass="modalBackground" PopupControlID="panelUpdateProgress" />
(My code is based on this sample weblogs.asp.net/blogs/guillermo/Code/modalExample.zip)
This is my button to call my method
<asp:UpdatePanel ID="updatePanel" runat="server">
<ContentTemplate>
<asp:Button ID="btMonth" runat="server" onclick="btMonth_Click" Text="Ver" />
</ContentTemplate>
</asp:UpdatePanel>
This is my c# code of my method btMonth_Click
protected void btMonth_Click(object sender, EventArgs e)
{
string query = "select * from table";
SqlDataSource1.SelectCommand = query;
gInd.DataSourceID = "SqlDataSource1";
}
As you can see while the “Loading” indicator appears I want to fill a GridView, but when I make click in my button the method btMonth_Click is invoked, the method is executed but my gridview doesn’t get filled. If I remove the asp:UpdatePanel of my button my gridview is filled fine
Is there something I’m missing?
You need to place your
GridVewinside of yourUpdatePanelin order to be partial renderedIf for design reasons you cannot place your grid inside the first
UpdatePanel, you can have severalUpdatePanelFor more info:
How to work with two update panels on same .aspx page