Search code examples
javascriptjqueryformscheckboxradio-button

Set checkbox as checked after radio button selection


For the beginning, I've Form that includes:

  • Three radio button (id: a-option,b-option,c-opion),
  • One Checkbox (id: optional),

and i would like to achieve that Checkbox can be selected manually as usual, but also the two of them should mark checkbox as selected automatically and disable possibility of unchecking it (let's say that will be b-option and c-option). How should i do that with JS or JQuery.


Solution

  • You can trigger checked property to #optional on click:

    $('#c-option').click(function(){
       $('#optional').prop('checked', true);
       $('#optional').prop('disabled', true);
    });
    
    $('#b-option').click(function(){
       $('#optional').prop('checked', true);
       $('#optional').prop('disabled', true);
    });
    
    $('#a-option').click(function(){
       $('#optional').prop('checked', false);
       $('#optional').prop('disabled', false);
    });