Required Fields Not Enforced, Redirect to Success Occurs

  • Resolved F C

    (@pmagony)


    5 years, 8 months ago

    Hello,

    We’re tracking form submissions by redirecting to a success page, after an event listener is triggered targeting each specific form.

    The issue we’re having is that if you load the page, don’t fill any fields out, hit submit… you get the error message, but then the redirect executes anyways.

    So it seems that it is either a bug or lack of functionality missing in the event listener.

    Here is my code:

    <script>
// Redirect forms to success page.
document.addEventListener( 'wpcf7submit', function( event ) {
    if ( '349' == event.detail.contactFormId ) {
        location = 'https://domain.com/consultation-success/';
        // Consultation Form
    }
	if ( '7' == event.detail.contactFormId ) {
        location = 'https://domain.com/contact-success/';
        // Contact Form
		}
}, false );
</script>

    Thanks for the assistance!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Takayuki Miyoshi

    (@takayukister)

    See https://contactform7.com/dom-events/

    Thread Starter F C

    (@pmagony)

    Thanks Tak,

    But this doesn’t answer the issue I am experiencing. According to the DOM events and my opening question, you’ll note that wpcf7invalid is triggered, but the form still submits as completed successfully.

    How does it submit, if the require fields are not populated?

    Thread Starter F C

    (@pmagony)

    This is resolved. The event listener needs to be set to ‘wpcf7mailsent’ and not ‘wpcf7submit’. Working code example:

    <script>
// Redirect forms to success page.
document.addEventListener( 'wpcf7mailsent', function( event ) {
    if ( '349' == event.detail.contactFormId ) {
        location = 'https://domain.com/consultation-success/'; // Route Form 1
        // Consultation Form
    }
	if ( '7' == event.detail.contactFormId ) {
        location = 'https://domain.com/contact-success/'; // Route form 2
        // Contact Form
		}
}, false );
</script>
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Required Fields Not Enforced, Redirect to Success Occurs’ is closed to new replies.