Show
The show function loads the Paysafe.js payment methods inside the selected HTML element containers (typically div elements) on your payment page. This function has no parameters.
The function should be invoked immediately after the setup function on the hosted fields instance, which is returned on setup.
The function signature is as follows:
instance.show()
.then((paymentMethods) => {
/** Continue with events handling */
if (paymentMethods.card && !paymentMethods.card.error) {
// Card payment method is successfully initialized
}
if (paymentMethods.applePay && !paymentMethods.applePay.error) {
// Apple Pay payment method is successfully initialized
}
})
.catch((error) => {/** Process any errors during the show */})Or you can use Async-await:
async function showPaysafeJS() {
try {
const paymentMethods = await instance.show()
/** Continue with events handling */
if (paymentMethods.card && !paymentMethods.card.error) {
// Card payment method is successfully initialized
}
if (paymentMethods.applePay && !paymentMethods.applePay.error) {
// Apple Pay payment method is successfully initialized
}
} catch(error) {
/** Process any errors during the show */
}
}Show functions return a Promise, which is then resolved in a payment methods object.
The paymentMethods object will contain a list of the provided payment methods on setup and the result from their initialization.
| Parameter | Optional | Type | Description |
|---|---|---|---|
| paymentMethods | |||
| card | true | Object | An object that will contain an error only if such occurs during the initialization of the payment method. When the initialization of the method is successful, an empty object will be returned. |
| applePay | true | Object | An object that will contain an error only if such occurs during the initialization of the payment method. When the initialization of the method is successful, an empty object will be returned. |
Show Errors
Show Error Object
The show() will throw an error only if none of the provided methods is successfully initialized.
The following table describes the contents of the error object:
| Parameter | Required | Type | Description |
|---|---|---|---|
| code | true | String | Error code |
| displayMessage | true | String | Error message for display to customers. |
| detailedMessage | true | String | A detailed description of the error (this information should not be displayed to customers). |
| correlationId | true | String | Unique error ID to be provided to Paysafe Support during an investigation. |