[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 826
  • Last Modified:

DISABLE SUBMIT BUTTON AFTER CLICKED or ENTER KEY IS PRESSED

Hi guys!

Is there a way to disable a submit button after the form is submitted?

I am having problems when the user clicks on a button more than one, or when the user press the ENTER key more than once.

Thanks!

PVG
0
pvg1975
Asked:
pvg1975
  • 3
  • 2
  • 2
  • +2
2 Solutions
 
archrajanCommented:
<html>
<head>
<script type="text/javascript">
function handleEnter (field, event) {
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
if (keyCode == 13) {
document.getElementById('sub').disabled = true;
//document.frm.submit();
}
}

</script>
</head>

<body onkeypress = "handleEnter(this,event)">
<form action="page2.html" name = "frm" onsubmit = "document.getElementById('sub').disabled = true">

<input type="submit" id = "sub" value="submit form">
</form>
</body>
</html>
0
 
archrajanCommented:
Also please check this version also:

<html>
<head>
<script type="text/javascript">
function handleEnter (field, event) {
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
if (keyCode == 13) {
document.getElementById('sub').disabled = true;
setTimeout('document.frm.submit();',2000)
}
}

</script>
</head>

<body onkeypress = "handleEnter(this,event)">
<form action="http://www.yahoo.com" name = "frm" onsubmit = "document.getElementById('sub').disabled = true">

<input type="button" id = "sub" value="submit form" onclick = "this.disabled = true;setTimeout('document.frm.submit();',2000)">
</form>
</body>
</html>
0
 
davidlars99Commented:
why deal with such comlex handling of keycodes when there's a simple solution..?


[script section]
function submitForm(form){
   document.getElementById("buttonID").disabled=true;
   submitForm = stopSubmit;
   return true;
}

function stopSubmit(form){
   return false;
}


[body section]
<form name="form1" method="post" action="somepage.asp"  onsubmit="return submitForm(this)">
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
pvg1975Author Commented:
Hi guys,

Your solutions are great, but I still can press ENTER more than once.

I have the following script:

<script language="JavaScript">
function MyConfirm()
{
if (confirm("Confirm this operation?"))
      document.all.Submit1.disabled = true;
else
return false;
}
</script>

<form name="form1" method="post" action="po_view_canceltransaction.asp" onSubmit="if (MyConfirm()==false)return false; else return true;">

I used all your posted codes but it doesn't seen to work.

Again, the problem is when the user press ENTER repeatedly.

Thanks for your time guys.
0
 
pvg1975Author Commented:
In the code I posted above, is it possible to return FALSE if ENTER if pressed?.... in other words, allow the user to submit the form only by clicking with the mouse.
0
 
ldbkuttyCommented:
<script language="JavaScript">
function MyConfirm(theForm) {
 return (theForm.Submit1.disabled = confirm("Confirm this operation?"));
}
</script>
<form name="form1" method="post" action="po_view_canceltransaction.asp" onSubmit="return MyConfirm(this)">
<input type="submit" name="Submit1" value="Submit"/>
</form>
0
 
rdivilbissCommented:
Get rid of this: document.all.Submit1.disabled = true;

It is IE only and nor specified anywhere in the W3C recommendations.

Use  archrajan's method which will also disable the Enter key if you add return !keyCode.
0
 
davidlars99Commented:
@ Your solutions are great, but I still can press ENTER more than once.

not with my solution
0
 
pvg1975Author Commented:
Thanks guys :)
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
  • 2
  • +2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now