Robbert Rosario asked 4 months ago
Hello,
I am loading Formidable Forms within a modal, which isn't visible on the page at first but is loaded on demand. Once I submit the form the page just refreshes. My theory is that JS hasn't been able to initialize on the form, but so would have to be retriggered. Does Formidable Forms have a re-initialize event?
For example another form plugin has:
const forms = document.querySelectorAll('.wpcf-form');
forms.forEach(form=>{
wpcf.init(form);
});
This is what I am looking for within Formidable, I have searched the docs but can't find it.
Victor Font Staff answered 4 months ago
Loading a form in a modal does not prevent jQuery from loading. The modal exists on the page and is hidden until invoked. Submitting a form always refreshes a page unless you have submit this page with Ajax enabled, but if you have confirmation messages enabled, the page will still refresh to display the message. jQuery/JavaScript are front end tools. They do not have reinit functions unless you create one in custom code for your purpose. This article explains how I reinit jQuery for newly added repeater rows. The same principle applies to any reint function. https://formidable-masterminds.com/repeaters-and-complex-jquery-operations/
Robbert Rosario
replied 4 months ago Sorry should have mentioned I am using AJAX.
Actually the modal exists on the page but the form doesn't and it's not hidden in the page. I am loading the form on-demand so it isn't there first page-load.
I don't know what repeaters are in Formidable Forms - I am just looking for a way to re-init the Formidable JS so that it looks at the DOM elements again.
The article I referenced may be about repeaters, but it's the only resource I have that teaches how to reinit JS after an Ajax call.
Robbert Rosario
replied 4 months ago I see, well I am a experienced developer and know my way around JavaScript so I am really just looking for some pointers to documentation of some sort to a Formidable Forms alternative too:
const forms = document.querySelectorAll('.wpcf-form'); forms.forEach(form=>{ wpcf.init(form); });
Which reinitialises the form and all the event handlers.
Bobby Clapp Staff answered 3 months ago
Not sure it will help, but here is a generic AI answer: https://paste2.org/EncjIn3JMaybe it will trigger some thought.
Please login or Register to submit your answer
