[CF7]I want to show confirm dialog before send.

I am making an inquiry page with a contact form7.

Confirmation message “Are you sure to send? [OK] [Cancel]” when sending
Issue (javascript confirm) and
I want to send an email only when [OK] is pressed, but I can’t.

For now, call your own function at wpcf7submit with addEventListener
As a process in that, I have been able to display a confirmation dialog, but
Stop processing and prevent emails from being sent if Cancel is pressed
can not do.

As a method I tried,
(1) If canceled, the return value of the own function is set to false.
(2) If canceled, propagation & processing is stopped.
(Call preventDefault(), stopPropagation(), stopImmediatePropagation())

I tried to do, but even if I cancel without any effect, the email will be sent.

I just want to do something as simple as displaying a confirmation dialog when sending, but I can’t do it.
If anyone knows, please let me know. Thank you.

source code is as follows.
————————————————– ————————————
Method I tried (1) (Return value of own function is set to false)
————————————————– ————————————

window.onload = function () {
  document.addEventListener ("wpcf7submit", function (event) {return OrderConfirm ()}, false);
};;
function OrderConfirm () {
  if (! confirm ("Are you sure to send?")) {
    return false; // I want to stop sending emails! But it will be sent
  }
  return true;
}

-------------------------------------------------- -----------------------------------
Method I tried (2) (Stop propagation & processing)
-------------------------------------------------- ------------------------------------
window.onload = function () {
   document.addEventListener ("wpcf7submit", function (event) {return OrderConfirm (event)}, false);
};;
function OrderConfirm (event) {
   if (! confirm ("Are you sure to send?")) {
     event.preventDefault ();
     event.stopPropagation ();
     event.stopImmediatePropagation ();
     return false; // I want to stop sending emails! But it will be sent
   }
   return true;
}

• This topic was modified 5 months, 2 weeks ago by midorin.