Datatrans PayPal Button
This library is meant to support Datatrans merchants in rendering the PayPal Smart Button . It acts as a wrapper and implements all required operations for checkout with PayPal directly from the merchant checkout page.
Configure and test the example
Events output
How it works
1) Initialize the library
<script src="https://pay.sandbox.datatrans.com/upp/payment/js/paypal-button-1.0.0.js" type="text/javascript"></script>
PayPalButton.init({
merchantId: '1100025160',
reqType: 'CAA',
currencyCode: 'CHF',
amount: '100',
createAlias: false
});
2) Listen for the init event and create the button
const configuration = {
paypaloptions: {
button: {
layout: 'vertical',
color: 'blue',
shape: 'rect',
label: 'paypal'
}
},
transaction: {
refno: myReferenceNumber,
authenticationOnly: false,
returnAddress: true
}
}
PayPalButton.on("init", function () {
PayPalButton.create(document.getElementById("paypalbutton"), configuration);
})
3) Listen for the authorization event and continue
PayPalButton.on("authorization", function (data) {
// handle transaction result
});
Reference
Events
Following events will be emitted by the library- init - emitted when the library is initialized and ready to use
- create - emitted when payment button is rendered
- authorization - emitted when an authorization response has been received - payload: authorization response
- error - emitted when an error occurs - <optional>payload: error message
Options and parameters
Option | Description | Data type | |
---|---|---|---|
merchantId | Your datatrans merchantId | String | |
currencyCode | Transaction Currency, 3 letter currency code (ISO 4217) | String | |
amount | Transaction Amount | String | |
reqtype | Request type CAA (direct debit) or NOA (authorization) | String | |
createAlias | Whether to create an alias (only allowed for zero amount authorizations) | boolean | |
paypalMerchantId | Your paypal merchant id | boolean | |
enablePayLater | Enable PayPal pay later (default:false) | boolean | |
buyerCountry | Set the buyer country (iso-alpha-2) for test purposes (sandbox only) | String | |
PayPal Options | Button styling configuration see Customize the PayPal buttons | Object | |
Transaction Object | Option | Description | Type |
refno | Your reference number. Find out more here | String | |
returnAddress | Whether to return the customer address to the Webhook | boolean | |
authenticationOnly | Only authenticate the transaction (used for deferred authorization) | boolean |