CODEWITHSUNDEEP
c#asp.netajax
Karthik Bammidi
Karthik Bammidi

Reputation: 1851

How to show result of an event in loading panel in asp.net

I am working on asp.net and ajax using c#. I am trying to create a new user registration where i am poping a updatepanel with loading image when an user clicks on submit button. and also i need to insert the data into database at the same time. I use the following code,

 <asp:UpdatePanel ID="updatepanel1" runat="server">
        <ContentTemplate>   
         <asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1">                                       </asp:TextBox>
    <asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1"></asp:TextBox>
    <asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1"></asp:TextBox>
            <asp:Dropdownlist ID="drpCountries" runat="server" Font-Bold="True" ForeColor="#FF3300"></asp:Dropdownlist>
            <br />
            <asp:Button ID="btnLoad" runat="server" onclick="btnLoad_Click" Text="submit" />
            </ContentTemplate>
            </asp:UpdatePanel>
 <asp:UpdateProgress id="updateProgress" runat="server">
     <ProgressTemplate>
            <div style="position: fixed; text-align: center; height: 100%; width: 100%; top: 0; right: 0; left: 0; z-index: 9999999; background-color: #000000; opacity: 0.7;">
                    <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/avatarloading.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:25%;left:35%;" /><center><span style="color:White;font-weight:bolder;font-size:x-large;"><b>Loading...</b></span></center>
            </div>
     </ProgressTemplate>

</asp:UpdateProgress>

and in my code behind file like,

protected void btnLoad_Click(object sender,EventArgs e)
{
//INsert the records into database
}

At first when user clicks on submit i am able to pop loading panel with loading gif image. after successful insertion i need to show some message like registration success in place of image on loading panel. please guide me.

Upvotes: 0

Views: 953

Answers (2)

timmkrause
timmkrause

Reputation: 3621

I'd create a panel which looks identical to the UpdateProgress markup (css classes) with a label in it. And on a successful operation you set the label text and switch the panels Visible property to true.

Upvotes: 0

Adil
Adil

Reputation: 148120

You can bind endRequest event of asp.net ajax to get control after ajax request completed.

<script language="javascript" type="text/javascript">

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(endRequest);

    function endRequest(sender, args) {
        alert("After ajax request");
    }  
</script>

Upvotes: 1

Related Questions