How to disable enable submit button through Javascript Jquery. How to prevent multiple clicks on same submit button. This is the common issue where user click on submit button multiple times. To prevent this issue you can disable submit button once user clicked.
How to Prevent Multiple clicks (or Form submission) using Javascript Jquery
Let’s take a simple javascript snippet which prevent multiple clicks on submit button.
1 2 3 4 5 |
<form action="process.php" method="post"> <input onclick="this.disabled='disabled'" type="submit" name="Submit" value="Submit Form" /> </form> |
On the onclick event put this.disabled=’disabled’ . This code will disable submit button once it’s clicked by user.
Jquery code to disable submit button.
1 2 3 4 5 |
$('input:submit').click(function() { $('input:submit').attr("disabled",true); }); |
How to disable enable submit button on checkbox check uncheck
when user check uncheck the checkbox. We need to enable or disable the submit button.
Jquery snippet
Create check box
1 |
<input type="checkbox" name="checkbox1" id="checkbox" /> |
Submit button
1 |
<input type="submit" name="submit_button" id="submit_button" /> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
$(document).ready(function() { $('#checkbox').click(function() { if($(this).is(':checked')){ ('#submit_button').attr('disabled','disabled'); } else{ ('#submit_button').removeAttr('disabled'); }); }); |