SIGN UP

Defer form init

By: Stephan Jambou | Asked: 10/09/2024
Forums › Category: How-to › Defer form init
0 Vote Up Vote Down
Stephan Jambou asked 2 months ago
Hello, I'd like to know if it's possible to defer the initialization of a form, let me explain. I'd like to load my form when I click on a button that will inject the shortcode and display my form.
This logic is already in place and my form is well integrated into my DOM, but the various services are not loaded, so when I submit it, I get various errors (ajax submission, captcha...). Is it possible to load all the necessary scripts later, once my form is present in my DOM? Or simply defer the initialization of my form? Thank you in advance for your reply.
1 Answers
0 Vote Up Vote Down
Victor Font answered 2 months ago

You cannot inject a shortcode on the front end and expect it to render a form. Shortcodes cN only be executed and their content rendered on the server. If you want to display a form when a button is clicked, render the form as usual and hide it until the button is clicked or create an Ajax function to render and display the form.

Stephan Jambou replied 2 months ago

That's what I've done, I've got an API route that does a do_shortcode and render the form correctly, no problem there.
I just need to load the scripts needed for recaptcha and ajax submission to work properly. And I don't seem to have a trigger to do that.
But thanks for your answer.

Victor Font replied 2 months ago

I don't think you understood my suggestion. I suggested to stop using Ajax to render the form with do shortcode. When you add your form to a page, wrap the shortcode in a div element and set the div element to display: none. When a user clicks a button, use jQuery to show() the div element and display the form. Everything will work as expected.

Stephan Jambou replied 2 months ago

I understand, but it's not a solution that suits me. The original purpose of this deferred rendering is to avoid loading the Formidable Forms scripts when the page loads, in order to improve site performance.
But thanks for your suggestion.

Victor Font replied 2 months ago

Formidable's scripts won't overload a page. What will slow down a page is very long forms with hundreds of fields and Ajax. If Formidable's scripts are slowing down your page, I suspect you got other things going on that impacts performance on your server.

Stephan Jambou replied 2 months ago

On a page with several forms configured with Recaptcha, the linked scripts are loaded as many times. This is a problem reported by pagespeed.web that I'd like to fix.

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
crossarrow-right