jQuery Disable Button function on second click

Question

I'm trying to prevent users from clicking the button on the page twice, so what I've been doing is hiding that button with jQuery after it's been clicked once. But is there a way instead of hiding that button to disable with jQuery that button after it was clicked once?

I've tried

$(document).ready(function () { $('#onClickHideButton').click(function () { $(this).prop('disabled', true); }); });

but the problem that I'm having with this function is that as soon as the button is clicked it it becomes disabled before it get the chance to submit the form, so the form never gets submitted.

How exactly is your form submitted? Do you have an <input type="submit"> on it, or do you submit it using a function? If the first, you should have no problem. If the latter, just call the function after disabling the button. — Traveling Tech Guy
– Traveling Tech Guy, Commented Oct 28, 2013 at 16:59

NDM · Accepted Answer · 2013-10-28 16:59:24Z

Why not disable the button when the form is submitted, since that's what you actually want to do...

$('#myForm').on('submit', function () { $('#myButton').prop('disabled', true); });

Bobby Shark · Accepted Answer · 2013-10-28 17:03:44Z

Instead of using a submit button, just use a simple button and send manually the form submit.

<input type="button" id="onClickHideButton" value="Submit"/> $('#onClickHideButton').click(function () { $(this).prop('disabled', true); $('#myform').submit(); });

or you could disable the button when the form is submitted

$('#myform').on('submit', function(e) { $('#onClickHideButton').prop('disabled',true); });

Collectives™ on Stack Overflow

jQuery Disable Button function on second click

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related