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
Issue
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.
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.
Hello Richard,
I was thinking about it and ask if there is an existing solution on that:
If there’d be a function like “gform_after_render” where I can, let’s say, a jQuery ajax function let send the current select after I filled it with the accordion items this would solve the problem.
Is there any way to update a field using jQuery/Javascript server side after it was rendered?
The point is that after a form input error my select field doesn’t remember the former selected value and is empty.
Can I somehow get the former field value when the form is returning with the error?
thanks for taking a look into here.
Unfortunately gform_post_render isn’t working because after submiting the form and it returns with an error, the former selected options isn’t selected anymore because the server doesn’t know anything about the generated options.
Even activating of ajax isn’t working because the answer of the httprequest doesn’t contain the selected option value.
I think what I am looking for is to send the accordion titles to the server using ajax after the form was rendered and append the options to the form select.
ANOTHER thought was to send the options via ajax to a gform_pre_render function in the functions.php but I don’t know how to do it.
Further question is if the form would then remember the selected option and sets it “selected” on form error?
This sounds like a bit of JS magic that’s happening client-side, so mixing client-side and server-side is asking for headaches. If you can’t populate the options on the form or server-side, one idea could be to save the selection on local storage whenever the select changes value, and populate on page load if the value exists on local storage (which, in this case, would be on validation error). If the form submits successfully, remember to remove the value from local storage so next time the user visits the form, the browser doesn’t automatically populate the select again.