Contact Form 7 in Lightbox : Working but not sending data on "submit"

Hey,

I followed an old solution for adding a contact form in a lightbox, which looks something like this:

<div id="register" style="display: none;">
<h4>Register Now!</h4>
[contact-form-7 id="8617" title="Event Register"]
</div>
<div class="vc_btn3-container  pinkbtn  vc_btn3-right">
<a class="vc_general vc_btn3 vc_btn3-size-md vc_btn3-shape-rounded vc_btn3-style-flat vc_btn3-color-grey f_lightbox" href="#register" title="" style="outline: none;" data-type="inline">Register Now</a></div>
[lightbox selector=".f_lightbox"]

The form shows up, just when I try to hit submit, it does NOTHING.

Anyone know how to fix this?

Thanks!

Also note, it’s not possible for me to use “modal solution” without completely rebuilding the website.

After some digging, I’ve found that the likely reason for this is because the contact form is not re-initializing their scripts when the lightbox is loaded. Is there a way to trigger these scripts to re-initialize once the lightbox pops up?

Hi @michigancreative,

Thanks for reaching out.

The lightbox will only include or contain the content within the target block, but it will not re-execute the scripts that are already executed. Hence, the form will not really work.

How about using modal element within the builder?

Please check this as well https://theme.co/apex/forum/t/elements-content-area-modal/10224/1

Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.