Select populated with options via JQuery doesn't keep selected value on submit error

Hello Community,

I did the following:

created a form contain a select field with two options (an empty one and one with a value, default is empty)
in the website I populate the select with options using jQuery.append() (around 20 options)
the source of options is an accordion and their titles are the options value and text

I select an option and submit the form
if the submit runs into a validation error (let’s say the email field wasn’t filled) the site returns to the form with error messages at the required fields
unfortunately the former selected options isn’t selected anymore

I know that the reason for this behavior is that the select gets refilled with options every time the site is loaded just like after the error redirect.

How can I get the selected value to reattach the selected property to the right option?

I hope this was understandable :). Thanks in advance.


You’ll also need to populate the field choices property server side. See the following article:

Thank you, Richard.
In this case I think it is impossible to use gform_pre_render. Please correct me if I’m wrong.

Pre rendering the select only has the two options mentioned above (empty one and one with value/text) and not the ones which are appended by JQuery AFTER the form has beend rendered.

How can I get the options to fill into the select server side?
Is there a way doing it with ajax asynchronously?

Reminder, the options values and texts are the titles of an accordion object.