How to show/hide gif image when button click in asp.net
Question
I have a asp page where i have a button.When i click on the button i should display a gif image.When the process is completed ,again the images has to be hidden.
Please find my below code behind
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript" language="javascript">
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="display: none" id="dvloader">
<img src="Images/process_status.gif" /></div>
<asp:Button ID="btnLoad" runat="server" Text="Load" OnClick="btnLoad_Click" />
</form>
</body>
Please find the below code behind
protected void btnLoad_Click(object sender, EventArgs e)
{
// Show the gif image
System.Threading.Thread.Sleep(5000);
// hide the gif image
}
How can i achive this ?
Thanks.
2 answers
solution1
3 ACCPTED 2009-11-24 10:43:39
The method in your example is server-sided. What you want to do is on the client side and must be done in javascript therefore.
You could use the client-sided onclick-event to show the GIF after the button has been clicked. You can set the client-sided onclick-event somwhere in the Page-Load method for example:
btnLoad.Attributes.Add("onclick", "alert('JavaScript to show GIF goes here...');");
After the PostBack, the GIF will be hidden again automatically...
solution2
0 2009-11-24 11:26:29
You could actually apply the event to the element without using the inline event handler.
Using jquery you could say:
$(document).ready(function() {
$('#btnLoad').click(function(){alert('JavaScript to show GIF goes here...');});
});
This assumes your button has an id of btnload.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.