PayPal Events

Below is a list of all the PayPal events that can be emitted during the integration process. These events help you monitor and respond to different stages of the transaction flow, from loading the PayPal script to handling payments.

paypalscript_loaded

The paypalscript_loaded event is triggered when PayPal has been successfully loaded and is ready for use. The callback parameter is_enableFunding object.

staxJs.on("paypal_script_loaded", function (enableFunding) {  
  /_ PayPal is successfully loaded \_/  
});

paypal_error

The paypal_error event is triggered when an error occurs, and it provides the associated error response object in the callback for troubleshooting.

staxJs.on("paypal_error", function (err) {  
  /_ PayPal has encountered an error described in err \_/  
});

paypal_buttons_created

The paypal_buttons_created event is triggered when the PayPal buttons have been successfully created, but not yet added to the DOM. It includes the string ID of the HTML container element where the buttons will be rendered.

staxJs.on("paypal_buttons_created", function (selector) {  
  /_ PayPal button object created but not rendered \_/  
});

paypal_buttons_rendered

The paypal_buttons_rendered is triggered when the DOM successfully renders the PayPal buttons. It includes the string ID of the HTML container element where the buttons have been rendered.

staxJs.on("paypal_buttons_rendered", function (selector) {  
  /_ PayPal buttons are now visible \_/  
});  

paypal_order_create_success

The paypal_order_created_success is emitted when a PayPal order has been successfully created before capturing the funds. It indicates that the order has been created and is ready to be sent to the API for processing. The event contains the order data object.
You can intercept this event and, for example, show a loader element while the transaction finishes.

staxJs.on("paypal_order_create_success", function (message) {  
  /_ PayPal order is created and starting to process \_/  
  loader.classList.add('is-visible');  
});

paypal_order_create_error

The paypal_order_create_error event is triggered when an error occurs during the PayPal order creation attempt. It contains the relevant error object details.
For example, you can intercept and handle this event by hiding a loader element.

staxJs.on("paypal_order_create_error", function (err) {  
  /_ PayPal order didn't create properly... \_/  
  loader.classList.remove('is-visible');  
});

paypal_order_payment_success

The paypal_order_payment_successevent is triggered when a PayPal order has been successfully captured. It contains the newly created invoice data, which contains the billing details. You can intercept this event and access the invoice object to extract the necessary details.

For example, you can retrieve the payment_method_id and display a success toast:

staxJs.on("paypal_order_payment_success", function (invoice) {
  /* PayPal payment finished successfully */
  loader.classList.remove('is-visible');
  toast.show(invoice?.payment_method_id);
});

paypal_order_payment_error

The paypal_order_payment_error event is triggered when an error occurs while attempting to capture the funds for a PayPal order. It contains the relevant error data object for troubleshooting.

You can intercept this event and handle it using the following code:

staxJs.on("paypal_order_payment_error", function (err) {
  /* PayPal payment finished unsuccessfully */
  loader.classList.remove('is-visible');
  toast.show(err);
});