Popups and Other Forms
      Back to home
      1. Knowledge Base
      2. Popups and Other Forms

      Show/Hide Radio or Dropdown Options

      Digioh supports Show/Hide Radio or Dropdown Options for form inputs based on values users select or submit in other fields. This feature customizes form visibility by showing specific options only when users make certain selections or input specific data. Common applications include displaying options relevant to a selected country or car make. The app also enables you to adjust the visibility of radio button and dropdown options based on values from other fields, making it a versatile tool for customizing option visibility in forms. Use Cases: This feature proves especially useful in scenarios such as:
      • Country-Specific Options: Display brand options based on the selected country (e.g., show “Toyota” only when users select “Japan”).
      • Product Customization: Show specific models based on the chosen product type, such as displaying “iPhone” options only when users select “Apple.”
      • Service Availability: Display service options based on a user’s location, such as “Express Delivery” only when the country is “USA.”
      • User Preference: Show meal preferences in a dropdown (e.g., vegan, vegetarian) only when users select “Yes” for dietary restrictions.
      • Conditional Fields: Display specific car insurance options in a dropdown only when users select “Car” as their insurance type.
      Installation: To take advantage of this feature, install the Show/Hide Radio or Dropdown Options app within Digioh. Here’s how:
      1. Access your profile menu in the top-right corner of Digioh.
      2. Select "Custom JS (Apps)."
      3. Find and install the "Show/Hide Radio or Dropdown Options" app from the Available section.
      Configuration: You manage the app’s configuration using field-level metadata. You can utilize two key commands for configuring the behavior of options:
      1. show_options_with: This command specifies which custom field(s) in the data layer the app should evaluate to determine if it should display certain options.
      Example: show_options_with: custom_1 This means the app evaluates the value of custom_1 . If the conditions are met, the specified options will show.  
      1. hide_options_with: This command specifies which custom field(s) in the data layer the app should evaluate to determine if it should hide certain options.
      Example: hide_options_with: custom_1 This means the app evaluates the value of custom_1 . If the conditions are met, the specified options will hide. You can use multiple values in a comma-separated format. Additional Example:
      • show_options_with: Use a single metadata field value, such as custom_1, custom_2, and specify multiple options (e.g., opt_1, opt_2, opt_3), each in a separate metadata field with its own metadata value.
      • hide_options_with: Similarly, use a single metadata field value, such as custom_1, custom_2, and specify multiple options (e.g., opt_1, opt_2, opt_3), each in a separate metadata field with its own metadata value.

      Example Configuration: Suppose opt_1 refers to the first option in a radio button group. If we set show_options_with: custom_1 and opt_1: Test1, the app evaluates custom_1's value in the data layer. If custom_1 matches “Test1,” then opt_1 (e.g., “Toyota”) will display; otherwise, it will remain hidden.

       

       

      Questions? Comments? Let us know at support@digioh.com!