CODEWITHSUNDEEP
javascriptiospaypalsdk
Paul Flahr
Paul Flahr

Reputation: 95

PayPal JavaScript SDK Pay by Credit or Debit button not loading form iOS 12.5.7

Just a basic framework to test PayPal - loads 2 buttons: Pay by PayPal and Pay by Credit or Debit Card. Working fine on every device I've tested except iOS 12.5.7 on iPad Air (best version I can install on this device). Newer iPhones with ver. 18 work fine.

For some reason, when I click the Pay by Credit or Debit card button, it shows the circle spinner (loading the credit/debit form fields) but then fails with error in console log: Unexpected token "?" and Reference error cannot find variable Zombo.

If I click pay by PayPal, it works fine, just the Credit/Debit option fails.

Tried on Macbook Safari and it works fine. Windows various browsers work fine.

Can't find anything on this. Any workarounds? Tried a bunch of things, nothing works.

Code for testing:

<!-- PayPal SDK with 'components' parameter to show Credit/Debit option -->
<script src='https://www.paypal.com/sdk/js?client-id=12345&components=buttons&currency=CAD'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>



<!-- Container for PayPal button -->
<div id="paypal_container"></div>

<script type="text/javascript"> 
$(function() {
    // Define the PayPal button with integrated Credit/Debit card option
    paypal.Buttons({
        style: {
            shape: 'rect',
            color: 'gold',
            layout: 'vertical',
            label: 'pay', // This label will be shown on the button
        },
        createOrder: function (data, actions) {
            // Set up the order details here (amount, currency, etc.)
            return actions.order.create({
                intent: "CAPTURE",
                purchase_units: [{
                    amount: {
                        currency_code: "CAD",
                        value: "100.00" // Replace with your actual value
                    }
                }]
            });
        },
        onApprove: function (data, actions) {
            // Capture the payment when the user approves it
            return actions.order.capture().then(function (details) {
                alert("Payment successful! Thank you, " + details.payer.name.given_name);
            });
        },
        onError: function (err) {
            // Handle any errors during the payment process
            console.error("Payment error:", err);
            alert("There was an issue processing your payment.");
        }
    }).render('#paypal_container'); // Render the button inside the container div
});
</script>

Upvotes: 0

Views: 33

Answers (1)

Paul Flahr
Paul Flahr

Reputation: 95

This works:

Changes credit/debit button behavior to "old" version

onShippingChange: function(data,actions){
  //if not needed do nothing..
  return actions.resolve();
},

Upvotes: 0

Related Questions