Events

Events are fired by Tebex.js upon specific actions to alert your frontend and enable you to take action when required. These events should not be used to confirm actual receipt of payment - you should use Webhooks instead.

To add an event callback, use Tebex.checkout.on() . The first argument to this function should be the name of the event to listen to, and the second argument should be a function to call when that function is fired:

Tebex.checkout.on("payment:complete", (event) => {
    console.log("Payment completed!", event);
});

Available events are as follows:

All events that can be listened to with Tebex.checkout.on() are exposed on the element as custom DOM events, which means you can use addEventListener to subscribe to them:

<html>
    <body>
        <tebex-checkout id="checkout"></tebex-checkout>
    </body>
    <script>
        const checkout = document.getElementById("checkout);
        
        checkout.addEventListener("open", () => {
            console.log("checkout opened");
        });

        checkout.addEventListener("close", () => {
            console.log("checkout closed");
        });

        checkout.addEventListener("payment:complete", (event) => {
            console.log("payment completed", event);
        });

        checkout.addEventListener("payment:error", (event) => {
            console.log("payment errored", event);
        });
    </script>
</html>

Last updated