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