Help with radio un disabling checkboxes with jQuery

JavaScript
1

I’ve looked at example codes but for some reason this isn’t working. First of all I have a radio button that I assigned a class to it. I am assigning a class because there may be more than one. In addition, there are radio checkboxes that are disabled by default but only clickable once I click that radio button. The initial disabling works in jQuery but making them enabled isnt working.

Here is the Javascript code in my header:


<script type="text/javascript">

$(function() {

  $('.smatch').attr('disabled', 'disabled');

});

  $('.dradio').click(function(){
                                              
  $('.smatch').removeAttr('disabled');

});

</script>

Now here is the HTML


<input type="radio" name="assign" class="dradio" value="1"> Value 1<br><br>

<li style="margin-left:25px; margin-top:10px;"><input type="checkbox" class="smatch" name="smatch[]" value="Mon"></li>
<li style="margin-left:25px; margin-top:10px;"><input  type="checkbox" class="smatch" name="smatch[]" value="Tue"></li>
2

@TegSkywalker - i think you answered your own question :slight_smile:

The initial disabling works in jQuery but making them enabled isnt working.

The initial disabling is in a DOM-ready function, i.e.:

$(function() {
    // ...do stuff when the page is ready
})

but the enabling as the result of the click event isn’t, because it’s outside the DOM-ready function. that means that jQuery is trying to attach the event handlers immediately, and the DOM isn’t ready yet (so the code has no effect). try this instead (moving both the initial disabling and the click handler inside the DOM-ready function):

<script type="text/javascript">

$(function() {

  $('.smatch').attr('disabled', 'disabled');

  $('.dradio').click(function(){
                                              
    $('.smatch').removeAttr('disabled');

  });

});

</script>

hope that helps :slight_smile: