Events
The full list of available events are:
Event Name | Description |
---|---|
beforeLoad | Before the widget resources get loaded |
afterLoad | After the widget resources were loaded |
beforeCreate | Before the widget instance is created |
afterCreate | After the widget instance is created |
beforeRender | Before the widget is rendered |
afterRender | After the widget is rendered |
fetchPaymentDataStart | Start of fetching the payment data |
fetchPaymentDataEnd | End of fetching the payment data |
purposeChanged | Purpose changed |
amountChanged | Amount changed |
currencyChanged | Currency changed |
paymentTypeChanged | Payment type changed (e.g. one-off or recurring) |
recurringIntervalChanged | Interval changed |
paymentMethodChanged | Payment method changed |
beforePaymentValidateAndSend | Before payment form has been validated and sent |
beforePaymentValidate | Before payment form has been validated |
afterPaymentValidate | After payment form has been validated |
paymentValidateSuccess | After payment form has been validated successfully |
paymentValidateError | After payment form has been validated with errors |
beforePaymentSend | Before payment form has been sent |
paymentComplete | After payment has been completed |
subscriptionUpdateComplete | After subscription has beeb updated |
subscriptionCancelled | After subscription has been cancelled |
Subscribe to an event
In order to subscribe to an event, call window.rnw.tamaro.events.<EVENT_NAME>.subscribe(<CALLBACK>)
.
- The
<EVENT_NAME>
can be found above - The
<CALLBACK>
is a JavaScript function that will be called once the event has fired.
In the following example the callbackPurposeChanged
function gets called whenever
the user changes the purpose of the donation form.
window.rnw.tamaro.runWidget('.rnw-tamaro-widget');
function callbackPurposeChanged(event) {
console.log(
`Received event ${event.eventName} with the following data:`,
event.data,
);
}
window.rnw.tamaro.events.purposeChanged.subscribe(callbackPurposeChanged);
All event handlers receive event
that is structured as such:
Property | Type | Description |
---|---|---|
eventName | string | The name of the fired event |
data | object | Tamaro event data |
data.api | object | API instance. Not present for the events beforeLoad , afterLoad , beforeCreate |
Calling subscribe
function will return new function that allows you
to unsubscribe from this event.
let unsubscribe = window.rnw.tamaro.events.purposeChanged.subscribe(
callbackPurposeChanged,
);
unsubscribe();
Subscribe to all events
The following snippet subscribes to all events of your Tamaro Widget and logs it to the console.
Object.keys(rnw.tamaro.events).forEach((eventName) => {
window.rnw.tamaro.events[eventName].subscribe((event) => {
console.log(event.eventName, event.data);
});
});
window.rnw.tamaro.runWidget('.rnw-tamaro-widget');