How to put loading image when something is processing?

Question

I am having page in that when we click on create button its sends web request to get the all links but mean while it takes some time to get all links working or not so at that time I want to put image load

 Button ID="btnRender" runat="server" Text="Page Render" OnClick="btnRender_Click" />
        <asp:Button ID="btn_submit" runat="server" Text="Submit" OnClientClick="javascript:finda();" />
        <asp:Button ID="btn_createlink" runat="server" Text="Create link" OnClick="btn_createlink_Click" />

i want to call on btn_createlink_Click" button when user clicks the image or text should appear

What kind of web request are you doing? Ajax? – jpmorin Apr 09 '13 at 06:01 — jpmorin, Apr 09 '13 at 06:01
httpwebrequest for getting links – hitarth Apr 09 '13 at 06:02 — hitarth, Apr 09 '13 at 06:02

Sunil · Accepted Answer · 2013-04-09T06:52:08.493

Without Ajax Tool:
This will call the loading image on button click and hide the image on page load completes.

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_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></title>
    <script type="text/javascript">
      function ShowProgressBar() {
        document.getElementById('dvProgressBar').style.visibility = 'visible';
      }

      function HideProgressBar() {
        document.getElementById('dvProgressBar').style.visibility = "hidden";
      }
    </script>
</head>
<body onload="javascript:HideProgressBar()" >
    <form id="form1" runat="server">
     <div>
  <div style="float:left;">
      <asp:Button ID="btn_createlink" runat="server" Text="Create link" OnClick="btn_createlink_Click" OnClientClick="javascript:ShowProgressBar()" />
  </div>
  <div ID="dvProgressBar" style="float:left;visibility: hidden;" >
        <img src="/images/progress_bar.gif" /> resolving address, please wait...
  </div>
  <br style="clear:both" />
</div>
    </form>
</body>
</html>

I found a lot of solutions, only your solution easily and workable, thanks. — user3721070, Oct 31 '19 at 06:25

score 0 · Answer 2 · edited May 23 '17 at 11:46

0

You can make this happen with the help of Multithreading with the BackgroundWorker Component. Have a look on Multithreading with Backgroundworker

Backgroundworker C# backgroundworker

and this

You can call your loading.gif image in _Dowork method. Hope this helps.

edited May 23 '17 at 11:46

Community

1
1

answered Apr 09 '13 at 06:06

Sandy

2,429
7
33
63

sorry bro its like (http://validator.w3.org/checklink) so when user will click on check its takes some time right to check links at that time i want that loading image – hitarth Apr 09 '13 at 06:16

score 0 · Answer 3 · edited May 23 '17 at 11:46

0

EDIT:

You might want to have a look at HttpResponse.Flush

Forces all currently buffered output to be sent to the client. The Flush method can be called multiple times during request processing.

See the following link: HttpResponse.Flush Method

You could show a loading image and call this method every X number of loaded links.

OLD:

Since the question is missing information, I will assume that you are doing an Ajax call in order to get a collection of links from the server and update a table.

I would suggest you to use jQuery and follow this previous answer on SO in order to display an animated loading spinner when a request is made and hide it when it is completed.

See the link: Jquery Ajax Loading image

edited May 23 '17 at 11:46

Community

1
1

answered Apr 09 '13 at 06:07

jpmorin

6,008
2
28
39

sorry bro its like (http://validator.w3.org/checklink) so when user will click on check its takes some time right to check links at that time i want that loading image.but its not ajax – hitarth Apr 09 '13 at 06:18
@hitarth I edited my answer according to your comment. I suggest to use the HttpResponse.Flush method. – jpmorin Apr 09 '13 at 06:50

How to put loading image when something is processing?

3 Answers3