zeckdude
zeckdude

Reputation: 16163

Why does my form not submit when I disable the submit after the first click?

I am trying to disable the submit button on a form so when the user clicks it twice it won't submit it again. I know there are already a few questions here that address that, but the solutions offered don't seem to be working.

I am using the solution offered here: Disable submit button on form submit

Here's my jQuery:

$('form#proof_form').submit(function(){
    $(this).children('input[type=submit]').attr('disabled', 'disabled');
});

After the submit button is pushed it is supposed to enter a saved value to a DB and then redirect to another page. Instead it is now reloading the current page without redirecting. I placed a test echo right after the user pushes the submit button and it doesn't work. Also the value is no longer posting to the DB, so I know it is disabling the submit button before it can send to the DB and redirect.

Here is my php:

if(isset($_POST['accept_proof'])){
    echo 'The form was submitted!';
    $sql = 'INSERT into orders SET
          name = "' . $_SESSION['name'] . '"';
    $conn->query($sql) or die($conn->error);
}

Why is the button not submitting after the first click?

Upvotes: 2

Views: 1433

Answers (4)

junEcho
junEcho

Reputation: 1

I've been stuck on this all day. My version of the submit button calls a validate function onclick, and then disables the button at the end of the validation. The problem I had was that since the button is disabled, and the form's action is not what I need, the button does not submit the form once it is disabled.

After hours of searching around the internet, I found that all I had to do was to call my form's submit() function after the disabling to submit the form.

So if my form's name is myform

then I call myform.submit() after the disabling.

Hope this helps

Upvotes: 0

Paul Calcraft
Paul Calcraft

Reputation: 933

Disabled HTML form elements are not submitted.

I'm guessing 'accept_proof' is the name of your submit button, so, because it's being disabled before the form is submitted, its value is not set in the POST to the server; isset($_POST['accept_proof']) is returning false, and your code inside the if isn't executing.

You'll need to check for the POSTed form some other way, e.g. isset() on a different field in the form.

Upvotes: 2

Timon. Z
Timon. Z

Reputation: 681

You forgot the "return false;"

Try this instead :

$('form#proof_form').submit(function(){
    $(this).children('input[type=submit]').attr('disabled', 'disabled');
    return false;
});

It works for me. http://jsfiddle.net/5S72w/2/

Upvotes: 1

Edgar Villegas Alvarado
Edgar Villegas Alvarado

Reputation: 18344

If the same page is refreshing, i think you forgot to put your form's action attribute. You should have this:

<form action="your_action" ...> 
  ... 
</form>

HOpe this helps. Cheers

Upvotes: 0

Related Questions