Arturo Arturo - 10 days ago 6
jQuery Question

Disable button after submit with jQuery not working

I am trying to prevent a form being submitted twice. I have implemented a solution that was previously posted, but I cannot make it work. The button is not disabled and the "alert" that I put for debugging is not displayed. Any ideas?

I have this code in the

$('#choice').submit(function()
{
$('#btnPlus').attr('disabled',true);
alert('done');
this.submit();
});


And this is the form:

<form id="choice" name='form' method="POST" action="/">
<input type="hidden" name="projId" value="{{proj}}">
<button type="submit" name="vote" id="btnPlus" value="p{{proj}}"></button>
</form>

Answer

You should add e.preventDefault() to stop the submit first then do what you want and trigger the submit after taht using this.submit();, since as written now the code you've in submit function will not execute and the page will be submited when you click :

$('#choice').submit(function(e)
{  
    //Stop submit
    e.preventDefault(); 

    //Do what you want
    $('#btnPlus').attr('disabled',true);
    alert('done');

    //Submit
    this.submit();
}); 

Hope this helps.