Hi, yes, I managed some of this but I don't think you get to see your own OrderID in the dashboard. The first part is to pass your OrderID in the order data, the other is to log/store the PayPal OrderID in your database (as your OrderID does not get returned in some of the web hook calls). Here's the code on my payment page (the bits in curly brackets are filled in by the PHP code that generates the page), I will describe a bit more after it: <html>
<head>
<!-- my stuff -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Ensures optimal rendering on mobile devices. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- Optimal Internet Explorer compatibility -->
</head>
<body>
<script
src="https://www.paypal.com/sdk/js?client-id={MY_CLIENTID}¤cy=GBP" data-order-id="{My Order ID}">
</script>
<!-- my stuff -->
<!-- my 'please wait' message that is shown when PayPal confirms authorisation -->
<div id="PleaseWait" style="display:none;position: fixed;top: 50%;left: 50%;width: 300px;line-height: 200px;height: 200px;margin-left: -150px;margin-top: -100px;background-color: #f1c40f;text-align: center;z-index: 10;font-size:40px;outline: 9999px solid rgba(0,0,0,0.5);">Please Wait</div>
<div id="paypal-button-container"></div>
<script>
ppoid=pptid='';
paypal.Buttons({
createOrder: function(data, actions) {
// This function sets up the details of the transaction, including the amount and line item details.
return actions.order.create({
style: {
label: "pay"
},
application_context: {
brand_name: 'Our Club Name',
shipping_preference: 'NO_SHIPPING'
},
purchase_units: [{
reference_id: '{My Order ID}',
amount: {
value: '{total to pay}',
currency_code: 'GBP'
}
}],
payer: {
name: {
given_name: '{FIRST}',
surname: '{LAST}'
},
email_address: '{EMAIL}',
address: {
country_code: '{Country CODE}',
address_line_1: '{ADD1}',
address_line_2: '{ADD2}',
admin_area_2: '{TOWN}',
admin_area_1: '{COUNTY}',
postal_code: '{POSTCODE}'
}
}
}).then(function(details) {
ppoid = details;
return details;
});
},
// this function handles the successful outcome
onApprove: function(data, actions) {
x = document.getElementById('PleaseWait');
if (x) {x.style.display='inherit';}
return actions.order.capture().then(function(details) {
pptid = details.purchase_units[0].payments.captures[0].id;
setTimeout(function(){window.location.href='thankyou.php?oid={My Order ID}&ppoid=' + ppoid + '&pptid=' + pptid;}, 500);
return details;
});
},
onError: (err) => {
console.error('*** error from the onError callback', err);
}
}).render('#paypal-button-container');
// This function displays Smart Payment Buttons on your web page.
</script>
</body> So you will see my "{My Order ID}" going in to the "purchase_units" section in the "reference_id" parameter: ...
purchase_units: [{
reference_id: '{My Order ID}',
amount: {
... You will also see that I added some code to the end of the "createOrder" method to store the PayPal orderID it generates in a local (JavaScript) variable "ppoid": ...
postal_code: '{POSTCODE}'
}
}
}).then(function(details) {
ppoid = details;
return details;
});
... And then on the "OnApprove" callback I redirect the user to my "thankyou.php" page passing it our OrderID, PayPal's OrderID as well as the "TransactionID" (returned when I call the "capture" method in the javascript): ...
onApprove: function(data, actions) {
x = document.getElementById('PleaseWait');
if (x) {x.style.display='inherit';}
return actions.order.capture().then(function(details) {
pptid = details.purchase_units[0].payments.captures[0].id;
setTimeout(function(){window.location.href='thankyou.php?oid={My Order ID}&ppoid=' + ppoid + '&pptid=' + pptid;}, 500);
return details;
});
... (I display a "Please wait" message when PayPal hands control back to me as I found the capture method was taking a few seconds to complete giving the user the chance to click other buttons on the page and cause chaos) My ThankYou page just reads my database to see the current status of my order - the webhook code will often have received the call from PayPal by the time it is doing this and the webook will have updated the order to show it has been completed successfully, but just in case the ThankYou page will check and either display a "Transaction complete, thank you" type message or a "We are just waiting on PayPal" message. The webhook code also sends them an email so they know when the transaction completes. Let me know if you would like to see the webhook code. I hope that helps! Regards Dik (aka FixItDik)
... View more
