Title: Execute client side code & validation before submit
Last modified: May 29, 2017

---

# Execute client side code & validation before submit

 *  Resolved [Marco Panichi](https://wordpress.org/support/users/marcopanichi/)
 * (@marcopanichi)
 * [9 years ago](https://wordpress.org/support/topic/execute-client-side-code-validation-before-submit/)
 * 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](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/](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](https://wordpress.org/support/users/marcopanichi/)
 * (@marcopanichi)
 * [9 years ago](https://wordpress.org/support/topic/execute-client-side-code-validation-before-submit/#post-9175991)
 * (I’m sorry: in my post there are some errors. Unfortunatly I can’t edit! – very
   sad)
 *  Plugin Author [Takayuki Miyoshi](https://wordpress.org/support/users/takayukister/)
 * (@takayukister)
 * [9 years ago](https://wordpress.org/support/topic/execute-client-side-code-validation-before-submit/#post-9178228)
 *     ```
       $('#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](https://wordpress.org/support/users/marcopanichi/)
 * (@marcopanichi)
 * [9 years ago](https://wordpress.org/support/topic/execute-client-side-code-validation-before-submit/#post-9201451)
 * 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.

 * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255)
 * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/)
 * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/)

## Tags

 * [validation](https://wordpress.org/support/topic-tag/validation/)

 * 3 replies
 * 2 participants
 * Last reply from: [Marco Panichi](https://wordpress.org/support/users/marcopanichi/)
 * Last activity: [9 years ago](https://wordpress.org/support/topic/execute-client-side-code-validation-before-submit/#post-9201451)
 * Status: resolved