You can add custom functionality on Contact Form 7 plugin after different actions have taken place, for example when an email has been sent. Contact Form 7 triggers some JavaScript events that you can easily access, here you will find an example using JQuery.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
if( $('.wpcf7').length > 0 ) {
 
  $(document).on('spam.wpcf7', function () {
    console.log('submit.wpcf7 triggered!');
  });
 
  $(document).on('invalid.wpcf7', function () {
    console.log('invalid.wpcf7 triggered!');
  });
 
  $(document).on('mailsent.wpcf7', function () {
    console.log('mailsent.wpcf7 triggered!');
  });
 
  $(document).on('mailfailed.wpcf7', function () { 
    console.log('mailfailed.wpcf7 triggered!');
  });
}
Add custom functionality to Contact Form 7
Tagged on:

One thought on “Add custom functionality to Contact Form 7

  • May 11, 2016 at 14:54
    Permalink

    Thanks for sharing it,

    Can you please give a tip on how treat custom messages in multiple contactform 7 at same page?

    Thanks in advance,

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *