WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have a contact form built with Contact Form 7. What I want to do is when the user hits the submit button to throw up a pop up window with a notice asking if their sure they want to submit the form with an ok or cancel button. I've found the hook 'wpcf7_before_send_mail'. I was hoping there might be something i could do in the additional settings. Something like

wpcf7_before_send_mail: "javascript here"

But when I have tried to just get an action to work like this say:

before_send_mail: "window.alert("hello");"

It just submits the form without doing anything.

How would I get a popup to appear with an ok and cancel button, ok submitting form and cancel breaking the action?

share|improve this question

closed as off-topic by birgire, toscho Jul 26 '14 at 9:51

This question appears to be off-topic. The users who voted to close gave this specific reason:

If this question can be reworded to fit the rules in the help center, please edit the question.

up vote 0 down vote accepted

The wpcf7_before_send_mail is a hook that is triggered after form submission, so it isn't what you're looking for.

You should make a javascript script that triggers when the user hits the submit button on your page. It's implementation could be a simple using javascript confirm() - example - or using a modal box to ask the user to confirm his choice.

share|improve this answer
Hi, is there a way do you know to add a onclick to a submit button? – David Mar 28 '13 at 14:29
Yes, jQuery. $('your-button').click(function){...}); – RRikesh Mar 29 '13 at 4:48

Easiest way, hook into the on submit there are several ways to do this and a simple google search for "javascript (or jquery) confirm submit" Will return quite a few. Here is one way

 var el = document.getElementById('FORMIDHERE');

 el.addEventListener('submit', function(){
     return confirm('Are you sure you want to submit this form?'); }, false);

I'm sure this could be factored into jQuery but JS is not my skill set. If you wanta get fancy with the confirm you can use something like alertify.js to style the confirm box.

Bottom line, there is really no need to hook into the plugin at all.

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.