SIGN UP

Is there a way to grey out certain options in a dropdown list/checkboxes, based on conditional logic?

By: b kn | Asked: 07/26/2022
Forums › Category: How-to › Is there a way to grey out certain options in a dropdown list/checkboxes, based on conditional logic?
1 Vote Up Vote Down
b kn asked 2 years ago
Hi,
Is there a way for some options in a dropdown list/checkboxes to be greyed out (not temporarily removed), based on what the user selects in a previous radio buttons field?
Thanks
2 Answers
0 Vote Up Vote Down
Chris Adams answered 2 years ago
You can do this with JS or jQuery. You can disable any option in a dropdown by adding the 'disabled' attribute to it and you can do this conditionally with jQuery quite easily. There isn't an example of this in the FF KB but there are some other examples that you could combine & edit to achieve what you need. https://formidableforms.com/knowledgebase/javascript-examples/  
b kn replied 2 years ago

Thanks - would this work for just greying it out (ie the user can still see the option but cannot select it) or would it mean they can't see the option altogether?

Chris Adams replied 2 years ago

<p>Yes this would mean users can still see the option but it would be greyed out and can't be selected.</p>

b kn replied 2 years ago

Thanks

0 Vote Up Vote Down
Chris Adams answered 2 years ago
This basic example will get the value from a Radio Button field and disable the same value in a dropdown. Change 804 to the field ID of the radio button and ht4d3 to the field KEY of the dropdown. 
<script>
jQuery(document).ready(function($){
  $('input[name="item_meta[804]"]').change(function(){
    var val1 = $(this).val();
    $("#field_ht4d3 option:contains('" + val1 + "')").attr("disabled","disabled");
    $("#field_ht4d3 option:not(:contains('" + val1 + "'))").removeAttr("disabled","disabled");
  });
});
</script>

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right