I am trying to make a selector available, only if a check box, or more than one are checked. The selector should go back to being disabled if the user unchecks all the checkboxes.
I was trying to implement my solution from this response (that it works perfect for one checkbox paired with any other selector) ; however, when I implement it like this:
$(document).ready(function(){
var enable_sel = function(){
$("#pizza_kind").prop("disabled", !$(":checkbox").prop("checked"));
};
enable_sel();
$(":checkbox").change(enable_sel);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
<input type="checkbox" id="p1" name="p1">
<input type="checkbox" id="p2" name="p2">
<input type="checkbox" id="p3" name="p3">
<select name="pizza_kind" id="pizza_kind">
<option>(choose one)</option>
<option>"Hawaian"</option>
<option>"Peperonni"</option>
<option>"Another"</option>
</select>
</form>
I got the selector disabled, but it seems that is only reacting to the first checkbox, not the rest of them.
I couldn't make this work in the javascript/html snippet, don't know why.
I am currently using Flask and jquery 3.6.0
What am I doing wrong?
Aucun commentaire:
Enregistrer un commentaire