Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Javascript click not loading woocommerce checkout page

In the following code, my button click is functioning. The product is added to the cart. But I must do a manual reload of the page for the woocommerce_checkout to load on the page (same page).

I tried location.reload and I also tried to redirect to another page where I also have the woocommerce_checkout shortcode but nothing seems to work.
All help is appreciated.

    jQuery('#submitproject').on('click', function () {
    jQuery.post({
        dataType: 'json',
        url: '/wp-admin/admin-ajax.php?action=wc_woocommerce_clear_cart_url',
        data: {
            action: 'wc_woocommerce_clear_cart_url'
        },
        success: function (data) {
            if (data.status != 'success')
                alert(data.msg);

            else
            {

                var numeroproduit = idproduit;
                console.log(numeroproduit);//15
                jQuery.get('/?post_type=product&add-to-cart='+numeroproduit, function () {});
                console.log("produit rajout");
                // window.location.href = "/paiement-projet";
                // location.reload();
                jQuery('#monpaiement').show();
                //jQuery('#mesinfos').hide();
                //jQuery('#monprojet').hide();
                //jQuery("#monpaiement").slideToggle();
                //jQuery('#submitproject').toggleClass('opened closed');
                console.log("after click success");

            }
        }

    });
});

Modified code trying to use Axelle’s solution :

    jQuery('#submitproject').on('click', function () {
    jQuery.post({
        dataType: 'json',
        url: '/wp-admin/admin-ajax.php',
        data: {
            action: ''
        },
        success: function (data) {
            if (data.status != 'success')
                alert(data.msg);

            else
            {

                var numeroproduit = idproduit;
                console.log(numeroproduit);//15
                jQuery.get('/?post_type=product&add-to-cart='+numeroproduit, function () {});
                console.log("produit rajout");
                //window.location.href = '/?post_type=product&add-to-cart'=+numeroproduit;
                // location.reload();
                window.location.reload(true);
                jQuery('#monpaiement').show();
                //jQuery('#mesinfos').hide();
                //jQuery('#monprojet').hide();
                //jQuery("#monpaiement").slideToggle();
                //jQuery('#submitproject').toggleClass('opened closed');
                console.log("after click success");

            }
        }

    });
});

As you can see I modified the url to not use the action hook and I added the page refresh javascript.

No the checkout does not appear. New code above. This code is included in a document.ready function. Correction, the new code doesn’t work. It doesn’t accept the url aadmin-ajax.php. Got a bad request alert. Sorry.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Here is the corrected code that functions. Thanks for the help.

    jQuery('#submitproject').on('click', function () {
    jQuery.post({
        dataType: 'json',
        url: '/wp-admin/admin-ajax.php?action=wc_woocommerce_clear_cart_url',
        data: {
            action: 'wc_woocommerce_clear_cart_url'
        },
        success: function (data) {
            if (data.status != 'success')
                alert(data.msg);

            else
            {

                var numeroproduit = idproduit;
                console.log(numeroproduit);//15
                jQuery.get('/?post_type=product&add-to-cart='+numeroproduit, function () {});
                console.log("produit rajout");
                window.location.href = '/?post_type=product&add-to-cart='+numeroproduit;
                jQuery('#monpaiement').show();
                jQuery('#mesinfos').hide();
                jQuery('#monprojet').hide();
                jQuery("#monpaiement").slideToggle();
                jQuery('#submitproject').toggleClass('opened closed');
                console.log("after click success");

            }
        }

    });
});

    As you can see I do a window.location.href to the get url and this sends me to the checkout page without refreshing and the item is in the cart.


  2. 0

    This page maynot able to load woocommerce checkout scripts,

    In this two way you can add the script to enable js events on your custom checkout page

    1. add wp_enqueue_script( 'wc-checkout' ); or

    2. Add add_filter( 'woocommerce_is_checkout', '__return_true')

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search