Home > Net >  Paypal Checkout onShippingChange won't work with Ajax-Call
Paypal Checkout onShippingChange won't work with Ajax-Call

Time:05-09

When a customer changes the shipping adress in the paypal checkout I am fetching it with "onShippingChange". However when I check the given adress and deny it or need to update the shipping costs it won't work.

Working example without the ajax call:

paypal.Buttons({
...
    onShippingChange: function(data, actions) {
        if(data.shipping_address.country_code == 'ES'){
            return actions.reject();
        }
    return actions.resolve();
...
});

As soon as I change it to the following it won't work:

paypal.Buttons({
...
      onShippingChange: function(data, actions) {
         fetch(ajax, {
            method: 'post',
            body: new URLSearchParams({
                'do':'getShippingPricePaypalCheckout',
                'country':data.shipping_address.country_code,
                'id':data.orderID
            }),
            headers: {
                'Accept': 'application/json',
                'content-type': 'application/x-www-form-urlencoded; charset=UTF-8'
            }
          }).then(function(res) {
              return res.json();
          }).then(function(_data) {
              if(!_data || _data == 'false' || _data == false){
                  console.log("Value of data: " data);
                  return actions.reject();
              }else
                  return actions.resolve();
          });
    }
...
});

In debug mode the actions.reject() is called. But in the paypal checkout the error-message, that the shipping country is not supported, will not show up.

The print out of console.log is correct and says "Value of data: false", so the actions.resolve() is being called but Paypal doesn't get it.

Any ideas?

CodePudding user response:

Ok, I found my mistake.

I need a return before the fetch:

...
onShippingChange: function(data, actions) {
         return fetch(ajax, {
...

Now it is working :)

  • Related