Adding HTML Data Attributes to Dynamic Dropdown Field

By: Ian Nicholson | Asked: 10/08/2023
ForumsCategory: Code HelpAdding HTML Data Attributes to Dynamic Dropdown Field
Ian Nicholson asked 6 months ago

Hi,  I have a Dynamic DropDown field in a form. I want to add a custom HTML data attribute to each of the Dropdown's options. Something like the following:

<option value="1" data-custom_attr="value_1">Option 1</option>
<option value="2" data-custom_attr="value_2">Option 2</option>
<option value="3" data-custom_attr="value_3">Option 3</option>

What I'm looking for is a filter that will allow me to modify each option's html so I can add my data attributes.

I haven't been able to find a solution in the Formidable docs.

Can anyone help? Thanks in advance, Ian

1 Answers
Rob LeVineRob LeVine answered 6 months ago
There are only two ways I can think of accomplishing your goal:
  1. Instead of a dynamic field, use an HTML field that is a shortcode to a PHP program that generates the entire SELECT element including its options.  That seems like a major pain in the butt.
  2. Use jQuery to add the attributes to the select options.
Ian Nicholson replied 6 months ago

Hi Rob,

Thanks for your input. Since posting my question I have been looking at a different approach to what I need to achieve. I think I'm going to abandon the Data Attributes idea and instead use a hidden lookup field that gets the data I need when the Dynamic Dropdown option is changed client side.

Cheers, Ian

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