I am trying to find out how can I disable the submit button until all form fields are filled. I have seen there are many solutions online in jQuery and JS.
But what I am looking for is, instead of checking all fields every time when there is a change in the field value, isn't there a way that checks the all the fields altogether at once at the end just like 'required' attribute?
For example, if you see the below solution provided here here.
$("input[type='text'], textarea").on("keyup", function(){
// checking for all fields on "keyup"
if (
$(this).val() != ""
&& $("textarea").val() != ""
&& $("input[name='category']").is(":checked") == true
) {
$("input[type='submit']").removeAttr("disabled");
} else {
$("input[type='submit']").attr("disabled", "disabled");
}
});
$("input[name='category']").on("change", function () {
if (
$(this).val() != ""
&& $("textarea").val() != ""
&& $("input[name='category']").is(":checked") == true
) {
$("input[type='submit']").removeAttr("disabled");
} else {
$("input[type='submit']").attr("disabled", "disabled");
}
});
We can see it's checking for all fields every time on keyup
or on change
is called. But I need to know if there is any other efficient way rather than checking all fields every time on keyup
or on change
is called?