Gravity Forms - How to Hide Some Options in a Dropdown pricing Field based on Value selected in Another Dropdown field

user_17232190 0
Viewed 574

Gravity Form ID: 54. I have a field where customers select their State. This is a standard dropdown field (Field ID is 11). I have another field (field ID 68) which is an "Option" field set as a dropdown. I want to be able to conditionally hide a few options/values in field 68 if the customer selects "Georgia" for their state (field 11). I read that I could achieve this through Javascript. I am very very new to JS and tried to piece together the code based on other requests, but my code is not working. None of the values are removed when I select Georgia as my state:

 jQuery(document).ready(function( $ ){
 jQuery("#input_54_11").on('change',function(){
    var property_state = jQuery(this).val();
    if (property_state == 'Georgia') {
           jQuery("#choice_54_68_2").hide();
           jQuery("#label_54_68_2").hide();
           jQuery("#choice_54_68_5").hide();
           jQuery("#label_54_68_5").hide();
        }
 });
});

Any help on what I am doing wrong would be greatly appreciated. As you can see above, I am trying to remove the third choice and the sixth choice in field 68 when Georgia is selected as a state. Also, I need to make sure that if a different state is selected after Georgia was first selected, that those options that were hidden reappear. Image below that also shows the labels in case that is easier to visualize. enter image description here

gravityforms gravity-forms-plugin jquery javascript
2 Answers

If Georgia is the only state with special limitations on property types, you can create two versions of the Property Type field – one with the property types that are specific to Georgia and one with the property types that apply to all other states. Then you'd configured each field to show in the appropriate context (whether Georgia is selected or not).

If you have multiple states with different property types, I would recommend a more robust approach where the choices are updated dynamically based on a map of states and their available property types. I wrote a full article about this here:

https://gravitywiz.com/how-to-create-conditional-choices-with-gravity-forms/

user_2277110

You could do something like this in jquery:

jQuery(document).ready(function($) { 
         $("#input_54_11").change(function() {
              var property_state = jQuery(this).val();
              if (property_state == 'Georgia') { // get the selected state
                jQuery("#input_54_68 option[value='Condominium']").hide();//replace with your value
              }else{
                jQuery("#input_54_68").children().show()
              };
         });
    });

I actually agree with Dave and think using Populate Anything would be WAY easier though. His link explains exactly how to do it. And if you happen to have Gravity View Import Entries, you could make a spreadsheet of all the choice options and upload to the new form.

user_33264060
Related