How to prevent form from being submitted?

Question

I have a form that has a submit button in it somewhere.

However, I would like to somehow 'catch' the submit event and prevent it from occurring.

Is there some way I can do this?

I can't modify the submit button, because it's part of a custom control.

Answer 1

On your form element, add an onSubmit attribute and put some javascript in it - return false to stop the submit.

<form method="POST" action="somepage" onSubmit="if(!Valid()){return false;};">

Where Valid is a javascript validation function.

If Valid returns true for valid or false for invalid, this can be shortened to:

onSubmit="return Valid();"

Answer 2

you can use onSubmit like this

<form onsubmit="alert('stop submit'); return false;" >

or

<javascript>
   function toSubmit(){
      alert('I will not submit');
      return false;
   }
</javascript>

<form onsubmit="return toSubmit();" >

demo

Answer 3

var form = document.getElementById("idOfForm");
form.onsubmit = function() {
  return false;
}

Answer 4

You can do it with jquery.

http://jquery-howto.blogspot.com/2009/05/disable-submit-button-on-form-submit.html

Answer 5

Unlike the other answers, return false is only PART of the answer. Consider the following

html

<form onsubmit="return mySubmitFunction()">
</form>

script

function mySubmitFunction()
{
  someBug()
  return false;
}

return false won't be executed and your form will be submitted (bit of a pain to debug). You also need to use preventDefault()

function mySubmitFunction(event)
{
  event.preventDefault();
  someBug();
  return false;
}

In this case, even with the bug the form won't submit!