I have several checkboxes and I need the submit button to be activated with at least one checkbox checked, I am using this function:
$("input:checkbox").on('change', function() {
$('#sub').prop("disabled", !this.checked)
}).trigger('change');
Where sub is the id of the button to disable or enable, but when I select three checkboxes and deselect one, the button is disabled again and I need it to be disabled only when no checkbox is checked.
Another option:
As you have it with a little modification you can get the expected result. Simply put in the
value
ofprop
an expression that evaluates to thelength
of thosecheckboxes
that arechecked
. I give you the example. I have also put a class to themcheckbox
to make sure that the ones you check are those and not otherscheckboxes
that you might have in yourDOM
Hello, first of all you should know about javascript selectors (or if you use Jquery)(I imagine you already know).
Then you must ask for a check event listener and place a class in each of them ´ ´ replace '@id=" + id + "' with your class and you are done. I hope it helps you.
Jason.
Your logic may be fine, but it is necessary to condition it, I better propose the following logic:
Manage all your checkbox elements by a single class to make them easier to reference, put the default attribute
disabled
on your button, then inside your change function create a variable that gets the total number of elements :checked with.length
and then conditions the variable if new is not equal to 0, remove the attributedisabled
from your button, otherwise return to the natural state.As you can see, the button is clickable only when one or more inputs are selected.
I hope it helps you, greetings.