• Resolved Marco Panichi

    (@marcopanichi)


    Hello everyone,

    WHAT I NEED

    I would like to perform some javascript operations when the user clicks Submit and before CF7 checks and submits the form.

    If these operations are not successful (error == true), I would like to block CF7 submitting the form.

    WHAT I’VE TRIED

    Cosa ho provato

    $('#wpcf7-form-id').submit(function(e){ 
    	...
    	if(error) { e.preventDefault(); } });
    	...
    }

    Does not work: code is executed but if error==true, submit is not blocked

    $('#wpcf7-form-id .wpcf7-form-control.wpcf7-submit').click(function(e){ 
    	...
    	if(error) { e.preventDefault(); }
    	...
    }

    Does not work, as described above.

    Of course, I’ve searched this forum, stackoverflow and wordpress stackexchange before asking.

    WHAT I HAVEN’T TRIED YET

    Before implementing these solutions, which require external libraries, I would like to see if there is a simpler solution:
    > Use an external library like Jquery Validation: https://stackoverflow.com/a/39098271/162049
    > Bypass the submit mechanis and build another one by myself: https://lampjs.wordpress.com/2017/02/17/manually-submitting-contact-form-7-ajax-and-adding-extra-fields/

    Thanks for every suggestion,

    Marco

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter Marco Panichi

    (@marcopanichi)

    (I’m sorry: in my post there are some errors. Unfortunatly I can’t edit! – very sad)

    Plugin Author Takayuki Miyoshi

    (@takayukister)

    $('#wpcf7-form-id .wpcf7-form-control.wpcf7-submit').click(function(e){ 
    	...
    	if(error) { e.preventDefault(); }
    	...
    }

    This should be able to block submission as you intend. If it doesn’t work, try adding $( this ).prop( 'disabled', true );

    Thread Starter Marco Panichi

    (@marcopanichi)

    Hi Takayuki,

    it worked, thank you very much!

    Marco

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Execute client side code & validation before submit’ is closed to new replies.