Dialog box when "Place Order" clicked

Question

I want to display a dialog box when my customer click "Place Order" on checkout page for last confirmation. I added following code

footer.php

<script type="text/javascript">
  function lastConfirm() {
   
     var r = confirm("Are you sure?");

     if( r == true){
        return true;
     } else {
        return false;
     }
   }
</script>

and I added onsubmit="lastConfirm()" inside form tag like below

form-checkout.php

<form name="checkout" method="post" class="checkout woocommerce-checkout" enctype="multipart/form-data" onsubmit="return lastConfirm()">

The dialog box pops up when I click "Place Order", but the order will be processed anyway whether I choose "OK" or "Cancel".

I want the order processed only when I click "OK". How could I accomplish this?

EDIT - The working answer form me is:
<form method="post" onsubmit="return lastConfirm()">
I just needed to remove some (well...most) attributes.

Possible duplicate of [JavaScript Form Submit - Confirm or Cancel Submission Dialog Box](https://stackoverflow.com/questions/6515502/javascript-form-submit-confirm-or-cancel-submission-dialog-box) — max, Aug 07 '18 at 06:59
I edited to add 'return', also checked another thread, but both didn't work for me. The order was processed anyway...Could anyone give me other suggestions? — Kiki, Aug 07 '18 at 07:10

kirellos sahdar · Accepted Answer · 2018-08-07T07:43:58.787

2

remove the elements from Form Tag and place only the javascript function in onsubmit

<form onsubmit="return lastConfirm()">

basically the code showing in your question works any way to show the js function

but you should prevent the form from proceed to its method or any other parameter that will effect on the page to refresh sense you want to do every thing with js function

edited Aug 07 '18 at 07:43

answered Aug 07 '18 at 07:14

kirellos sahdar

46
1
3

You gave me a huge hint!!!
This worked as I wished!!!
– Kiki Aug 07 '18 at 07:22
you can include class as well – kirellos sahdar Aug 07 '18 at 07:25
I don't understand how is this a help? This is basically an omit of other attribute? – Tree Nguyen Aug 07 '18 at 07:30
@TreeNguyen the form itself proceed with the js function which he doesn't need any how it solved his issue relax – kirellos sahdar Aug 07 '18 at 07:32
@kirellossahdar I know it works. But this is not an answer since you are not explaining why it work – Tree Nguyen Aug 07 '18 at 07:35
@Kiki you should accept my answer if it helps you you shouldn't answer with an answer – kirellos sahdar Aug 07 '18 at 07:35
@TreeNguyen this is basics no need to an explanation basically i should comment that which is not allowed with 1 reputation lol stick to the basics – kirellos sahdar Aug 07 '18 at 07:38
this is still not working correctly...Order still processed whether I choose "OK" or "Cancel"... – Kiki Aug 07 '18 at 07:50
@Kiki my answer were clear remove the method with post – kirellos sahdar Aug 07 '18 at 07:52
@Kiki and what do you mean by `click ok or cancel not proceed` you should implement that in your js function when you cancel what it should do and when you press ok what it should do ! – kirellos sahdar Aug 07 '18 at 07:56
ok now,
worked. I shouldn't add class name either. I suppose something from WooCommerce was overriding to process the orders. I hope this helps someone who will try something similar.
– Kiki Aug 07 '18 at 07:58
@kirellossahdar I can't accept your answer since your answer was not enough to work correctly, but gave me a hint. Thank you. – Kiki Aug 07 '18 at 08:02
@Kiki its ok as long as its solve your issue forget about petty downvoters – kirellos sahdar Aug 07 '18 at 08:11
@Kiki This should be the accepted answer, even if is incomplete. You should remove your answer and add an edit at the end of your question instead. If you don't play the StackOverFlow "game roles" (author of a question VS answerers), less people are going to answer your future questions. – LoicTheAztec Aug 07 '18 at 11:25
That'll be confusing for people who will be looking for the same answer in the future...but okay, if that's a "rule"... – Kiki Aug 07 '18 at 23:20
@LoicTheAztec WRONG if you want to use js to handle some staff out side of form elements you should call only onsubmit to call the js function and the rest will be handled by js if you implemented it correctly , read more about forms and handle js there is a bazillion data about it over stack overflow . – kirellos sahdar Aug 08 '18 at 13:42
@kirellossahdar Oh yes you are completely right… sorry I didn't really pay attention to your answer, as I was focused on KIKI answer to my comment. – LoicTheAztec Aug 08 '18 at 13:51

score 1 · Answer 2 · edited Aug 07 '18 at 11:29

1

call your function inside the condition was true.

edited Aug 07 '18 at 11:29

LuFFy

8,799
10
41
59

answered Aug 07 '18 at 07:37

Patharraj

41
2

Dialog box when "Place Order" clicked

2 Answers2