WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
[resolved] Can't submit WPCF7 from within Fancybox (6 posts)

  1. TJ Kelly
    Member
    Posted 4 months ago #

    I can't submit a basic contact form if the form is loaded from within a Fancbox modal window. My site is here - http://pattiengineering.com/expertise/

    I disabled the Fancybox load and tested the form when it's on the page like all the other standard content and it submits perfectly.

    Does Fancybox 3 Beta conflict with WPCF7? Does moving the form outside the normal page area and inserting before </body> have any impact on the form functionality?

    https://wordpress.org/plugins/contact-form-7/

  2. buzztone
    Member
    Posted 4 months ago #

    RE: Does Fancybox 3 Beta conflict with WPCF7?

    Probably​ - likely to be a Javascript Conflict - see Contact Form 7 Email Issues - there is a link there that covers Javascript Conflicts.

    ​​​RE: Does moving the form outside the normal page area and inserting before </body> have any impact on the form functionality?

    Presumably this is done with Javascript - so yes again.

  3. TJ Kelly
    Member
    Posted 4 months ago #

    There must be some way to make these two play nice. Can cf7 submit without using javascript at all? Or can I modify the code output so that moving the form just before the </body> tag won't affect it?

    As noted, I see no javascript error or console log message of any kind. It's as if the cf7 event listener just doesn't know I've clicked submit. It sounds like there's an easy way around that, but I'd rather not modify the plugin. Is there a better way?

  4. TJ Kelly
    Member
    Posted 4 months ago #

    I just discovered that my submissions were received successfully in Flamingo. I never received an email with the submission, but that may be a different problem entirely.

    I did not get a thank you message of any kind. I'll look into whether or not the alert <div> element is copied into the fancybox w/ the form. If not, it seems this issue may resolve itself. Looking into it further now...

  5. buzztone
    Member
    Posted 4 months ago #

    RE: Can cf7 submit without using javascript at all

    You can stop Contact Form 7 loading any JavaScript

    When the value of WPCF7_LOAD_JS is set to false (default: true), Contact Form 7 does not load the JavaScript. You can set the value of this constant in your wp-config.php like this:

    define('WPCF7_LOAD_JS', false);

    See http://contactform7.com/loading-javascript-and-stylesheet-only-when-it-is-necessary/

    You will lose all of CF7's Javascript functionality and of course the real cause is the theme or other plugin which I would definately regard as poorly written and avoid using.​​

    RE: I never received an email with the submission, but that may be a different problem entirely.​​​

    ​​Might be related to your Javascript conflict. If not see Contact Form 7 Email Issues. Most people that work through this information appear to be able to resolve their email sending & receiving issues.

    All the info you have provided clearly indicates a Javascript conflict. You often won't see "a javascript error or console log message of any kind"​.

  6. TJ Kelly
    Member
    Posted 4 months ago #

    Thank you for your help. I was able to resolve this, even without disabling cf7's javascript.

    The element I was pulling into a fancybox was breaking the JS. I moved the fancybox selector up a level so it pulled in the element in question AND other elements inserted after it. Doing that fixed all my problems.

    It wasn't a theme or plugin conflict or a CF7 error. It was 100% user error. I hope this thread helps someone in the future! Thanks again for your input on this.

Reply

You must log in to post.

About this Plugin

About this Topic