dkirk Posted December 14, 2007 Share Posted December 14, 2007 I have a form in which I am trying to hide the submit button once it has been clicked and replace it with a gif image. The code that I am trying is below but I cannot get it to work. Right now both elements show up at the same time. Please help! <script type="javascript"> function onSubmit(){ document.getElementById('submitButton').style.display = "none"; document.getElementById('progressBar').style.display = "block"; } </script> <form action="..." onSubmit="return onSubmit()"> ..... <div id="submitButton"> <input type="button" value="submit"> </div> <div id="progressBar" style="display: hidden"> <img src="progressbar.gif"> </div> </form> Link to comment https://forums.phpfreaks.com/topic/81723-solved-onsubmit-showhide/ Share on other sites More sharing options...
phpQuestioner Posted December 14, 2007 Share Posted December 14, 2007 <script language="javascript"> function mySubmit() { document.getElementById('submitButton').style.display = "none"; document.getElementById('progressBar').style.display = "block"; } </script> <form action=""> <div id="submitButton"> <input type="button" value="submit" onclick="mySubmit()"> </div> <div id="progressBar" style="display:none"> <img src="progressbar.gif"> </div> </form> Link to comment https://forums.phpfreaks.com/topic/81723-solved-onsubmit-showhide/#findComment-415056 Share on other sites More sharing options...
dkirk Posted December 14, 2007 Author Share Posted December 14, 2007 This works but my form does not get submitted?? Link to comment https://forums.phpfreaks.com/topic/81723-solved-onsubmit-showhide/#findComment-415079 Share on other sites More sharing options...
phpQuestioner Posted December 14, 2007 Share Posted December 14, 2007 change your input type from "button" to "submit" currently is: <div id="submitButton"> <input type="button" value="submit" onclick="mySubmit()"> </div> would need to be: <div id="submitButton"> <input type="submit" value="submit" onclick="mySubmit()"> </div> Link to comment https://forums.phpfreaks.com/topic/81723-solved-onsubmit-showhide/#findComment-415087 Share on other sites More sharing options...
dkirk Posted December 14, 2007 Author Share Posted December 14, 2007 finally got it straight with a different approach but thanks for the help. <html> <head> <title>Submit Hider</title> <script type="text/javascript"> function onSubmitButton(){ document.getElementById("submitButtonDiv").style.display = "none"; if (navigator.appName == "Microsoft Internet Explorer") { document.getElementById("progressBar").innerHTML = ""; document.getElementById("progressBar").style.display = "block"; document.getElementById("progressBar").innerHTML = "<img src='progressbar.gif' alt='Progress Bar'>"; } else { document.getElementById("progressBar").style.display = "block"; } } </script> <body> <form action="" onsubmit="return onSubmitButton()"> <div id="submitButtonDiv"> <input type="submit" value="submit"> </div> <div id="progressBar" style="display:none"> <img src="progressbar.gif" alt="Progress Bar"> </div> </form> </body> </html> Link to comment https://forums.phpfreaks.com/topic/81723-solved-onsubmit-showhide/#findComment-415104 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.