Apply jQuery before add to cart action in woo-commerce word press

63
June 14, 2021, at 2:30 PM

I need a confirmation popup before user proceed to add to cart. If user click to yes in confirmation box then should add product to cart and redirect to cart page as what happens in normal flow, in woo commerce wordpress. I have added below code in woocommerce/templates/single-product/add-to-cart/simple.php.

When click on "Yes" button it redirects to the page and do not add product to cart. Below is my code for same:

var cat_name = document.getElementById('cat_name').value;
    if(cat_name != ''){
        var el = document.getElementById('add_to_cart_submit');
        el.addEventListener('submit', function(e){
            e.preventDefault();
            $("#dialog-confirm").dialog({
                resizable: false,
                modal: true,
                title: "Terms and Conditions",
                height: "auto",
                width: 400,
                open: function(event, ui) { 
                    $('.ui-widget-overlay').bind('click', function()
                    { 
                        $("#dialog-confirm").dialog('close');
                    }); },
                create: function (e, ui) {
                    var pane = $(this).dialog("widget").find(".ui-dialog-buttonpane")
                    $("<label class='confirm-check' ><input  type='checkbox'/> I acknowledge I have read and accepted the above statements</label><p id='insideStyle' style='display:none;color:red; margin: 0; font-size: 14px;'>Required*</p>").prependTo(pane)
                },
                buttons: {
                    "Yes": function () {
                        if($('.confirm-check input').is(":checked")){
                            $(this).dialog('close');
                            $("#add_to_cart_submit").submit();
                        }else{
                            $("#insideStyle").show();
                        }
                    },
                        "No": function () {
                        $(this).dialog('close');
                    }
                }
            });
        }, false);
    }
READ ALSO
Sum document fields where the reference id is equal

Sum document fields where the reference id is equal

I have these documents with the following structure:

60
(Show more/Show less)For only one &lt;td&gt; in table in angular

(Show more/Show less)For only one <td> in table in angular

I have table and I want to use show more/ show less text posreport

46
What&#39;s wrong with my SQL Statement in python? [closed]

What's wrong with my SQL Statement in python? [closed]

Want to improve this question? Update the question so it's on-topic for Stack Overflow

82
Change ID and Class by click

Change ID and Class by click

i'm creating visual configurator for a car and wheels

45