Basically i need an image to be displayed for two seconds once the submit button is clicked, kinda like a preloader, just for show really. Can't seem to call the JavaScript function from my asp code...?
VB.NET:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="Blank_Course_Create._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>MIS - Create Course</title>
<script type="text/javascript">
function doHide() {
document.getElementById("imgToHide").style.display = "none";
}
function hideImage() {
// 2000 = 2 seconds
setTimeout("doHide()", 2000);
}
</script>
<style type="text/css">
.style1
{
font-family: Verdana;
font-size:12px;
}
</style>
<style type="text/css">
A:link {text-decoration: none; color: Black;}
A:visited {text-decoration: none; color: Black;}
A:active {text-decoration: none; color: Black;}
A:hover {text-decoration: underline; color: Navy;}
</style>
</head>
<body onload="javascript:hideImage()">
<form id="form1" runat="server">
<div style="width: 100%; height: 100%; font-weight: 400; font-family: Verdana; background-color:#FF4500; color:White; padding-top:5px; padding-bottom:5px;">
<center>Course Create</center></div>
<div style="width: auto; height: 100%; font-weight: 400; font-family: Verdana; background-color:white; color:black; border-bottom:#cccccc solid 1px;
border-left:#cccccc solid 1px; border-right:#cccccc solid 1px; ">
<div style="padding-left:20px; padding-right:20px;">
<br/>
<p class="style1" style="font-style:italic;">
Select a Department and the click Next:
<asp:DropDownList ID="ddlDept" runat="server" Width="250px">
<asp:ListItem></asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
<asp:ListItem>****</asp:ListItem>
</asp:DropDownList>
</p>
<p class="style1" style="font-style:italic;">
<asp:LinkButton ID="LinkButton1" runat="server">Next</asp:LinkButton>
</p>
<p class="style1" style="font-style:italic;">
</p>
</div> <%-- end div for indent frame --%>
</div><%-- end div for outer frame --%>
<div style="padding-left:20px; padding-right:20px; width:auto; height: 100%; font-weight: 400; font-family: Verdana; background-color:#FF4500; color:White; padding-top:5px; padding-bottom:5px;">
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="hideImage()" />
<asp:Button ID="btnClear" runat="server" Text="Clear" />
</div>
<center>
<p style="font-size:smaller;">
<asp:Label ID="lblDetails" runat="server" Text="Label" ForeColor="#999999" ></asp:Label>
</p>
<%-- FOR TESTING ONLY --%>
<p>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</p>
<p>
<img id="imgToHide" alt="Loading..." longdesc="preloader" src="109.gif"
style="width: 84px; height: 64px" /></p>
<%-- END: TESTING ONLY --%>
</center>
</form>
</body>
</html>