Multiple Checkbox disable some options

HI,
i have form that has multiple choices that I'm displaying as checkboxes. What I want is if option 1 is selected then disable option 4,5,6. Is this possible, as on my form I can get a list of the checkbox but can't seem to set them as disabled like this
var list = document.querySelectorAll('.equipment-list input[type="checkbox"]')
list.forEach(function(item,index){
if(item.value === "Desktop Monitor"){
console.log('disable this item', item)
item.disabled = true
}
})

Hello @stefen,

You can disable specific checkbox option with this code:

//find the second option
var option2 = $(".equipment-list").find('input[type="checkbox"]')[1]; 
//disable the second option
$(option2).prop( "disabled", true );

Hi @mnikitina,

I've tried your solution but the checkbox is still enabled. When I check the disabled prop it's set to true
image so in this screen shot the Desktop Monitor checkbox should be disabled but it's still enabled
image
Does it matter that the field is a multiple choice from Sharepoint?

Hello @stefen,

Please try out this code:

function disableOption2(){
    var option2 = $(fd.field('ChoiceField').$el).find('input[type="checkbox"]')[1];
    $(option2).prop( "disabled", true );
}

fd.spRendered(function(){
  disableOption2();
  fd.field('ChoiceField').$on('change', function(value){
    if(value.includes('Desktop Monitor')){
      setTimeout(function(){ disableOption2(); }, 1);
    }
  });
}); 

Please replace ChoiceField with the internal name of the field.

Hi @mnikitina,

this works great, Thank you so much

Kind Regards
Stefen

1 Like