onApprove: (data, actions) => { console.log(data); return actions.order.capture().then(function(orderData) { // Successful capture! For dev/demo purposes: console.log('Capture result', orderData, JSON.stringify(orderData, null, 2)); const transaction = orderData.purchase_units[0].payments.captures[0]; alert('Transaction '+transaction.status+':'+transaction.id+'See console for all available details'); // When ready to go live, remove the alert and show a success message within this page. For example: // const element = document.getElementById('paypal-button-container'); window.transaction_id = transaction.id; $.post( '/lib/ajax/ajax.php', { action: 'process_payment', }, function(data){ if(data.success){ $('.pay_wrapper').html('

Thank you for your payment!

'); $('#checkout').hide(); } else{ $('.pay_wrapper').html('

Your Suggestions Are Not Live

Contact us Something went wrong. Transaction ID:'+window.transaction_id); $('#checkout').hide(); } } ); },'json'); } } paypal.Buttons({ // Sets up the transaction when a payment button is clicked createOrder: (data, actions) => { return actions.order.create({ purchase_units: [{ amount: { value: '".$total."' // Can also reference a variable or function } }] }); }, onError: function (err) { // For example, redirect to a specific error page console.log(err); }, onApprove: function (data, actions) { return fetch('/my-server/capture-paypal-transaction', { headers: { 'content-type': 'application/json' }, body: JSON.stringify({ orderID: data.orderID }) }).then(function(res) { return res.json(); }).then(function(captureData) { if (captureData.error === 'INSTRUMENT_DECLINED'); // Your server response structure and key names are what you choose return actions.restart(); } }); } }).render('#paypal-button-container');