How to disable the submit button AFTER the browser has fields with a required attribute set?
We use the following jQuery to disable submit buttons to prevent double submissions (server slow!).
jQuery(document).ready(function($){
/*SENDE BTN INAKTIV STELLEN*/
$("input[type=submit]").click(function() {
$(this).css({'opacity':'0.5','cursor':'wait'}).attr('disabled','disabled');
});
});
However, how do we run the script AFTER the browser has validated all fields with the 'required' attribute in our HTML form?
+3
source to share
1 answer
EDIT: I found a much more elegant way to do this. Please accept this answer if it works for you.
jQuery(document).ready(function($){
/*SENDE BTN INAKTIV STELLEN*/
$("input[type=submit]").click(function() {
var myform = $('#theform');
//checks if the form is valid
if(myform[0].checkValidity())
{
$(this).css({'opacity':'0.5','cursor':'wait'}).attr('disabled','disabled');
}
});
});
//this is slightly awkward but it works
jQuery(document).ready(function($){
/*SENDE BTN INAKTIV STELLEN*/
$("input[type=submit]").click(function() {
var flag = true;
$('[required]').each(function(){
if(!$(this).val())
flag = false;
});
if(flag){
$(this).css({'opacity':'0.5','cursor':'wait'}).attr('disabled','disabled');
}
else
return false;
});
});
+3
source to share