Skip to main content

Custom Events

Integrate the Ventrata checkout solution to external applications using custom events.

Updated over 3 weeks ago

Event

Details

Name

ventrata-order-created

Description

fires after order creation with order id as event detail

Usage

document.addEventListener('ventrata-order-created',
   (event) => {
      alert(`ventrata order created with ID :${event.detail.id}`)
    }
  )

Event

Details

Name

ventrata-order-updated

Description

fires after the order is updated with order id as event detail

Usage

document.addEventListener('ventrata-order-updated',
   (event) => {
      alert(`ventrata order with ID :${event.detail.id} was updated`)
    }
  )

Event

Details

Name

ventrata-order-confirmed

Description

fires after the order gets confirmed (set as paid) with order id as event detail

Usage

document.addEventListener('ventrata-order-confirmed',
   (event) => {
      alert(`ventrata order with ID :${event.detail.id} was successfully paid`)
    }
  )

Event

Details

Name

ventrata-order-expired

Description

fires after the order expires with order id as event detail

Usage

document.addEventListener('ventrata-order-expired',
   (event)=>{
      alert(`ventrata order with ID:${event.detail.id} expired`)
   }
 )

Event

Details

Name

ventrata-booking-created

Description

fires after booking creation with booking id as event detail

Usage

document.addEventListener('ventrata-booking-created',
   (event) => {
      alert(`ventrata booking created with ID :${event.detail.id}`)
    }
  )

Event

Details

Name

ventrata-booking-updated

Description

fires after booking is updated with booking id as event detail

Usage

 document.addEventListener('ventrata-booking-updated',
    (event) => {
       alert(`ventrata booking updated with ID :${event.detail.id}`)
    }
  )

Event

Details

Name

ventrata-booking-removed

Description

fires after booking is removed with booking id as event detail

Usage

document.addEventListener('ventrata-booking-removed',
   (event) => {
      alert(`ventrata booking removed with ID :${event.detail.id}`)
    }
  )

Event

Details

Name

ventrata-checkout-closed

Description

fires when the Ventrata pop-up widget is closed

Usage

document.addEventListener('ventrata-checkout-closed',
   (event) => {
      alert(`pop-up is closed`)
   }
 )

📒 NOTE

This event is triggered whenever the checkout is closed — meaning every type of closure. For example:

  • when no order is created and a user opens and closes the checkout,

  • when there’s a multibooking and someone clicks the “X”,

  • or when an order is completed and someone still clicks the “X”.

It is important to keep this in mind if you plan to connect anything to this event.
For example, if you want to trigger a survey event to find out why customers left the checkout, you will also need to check whether an order was created and if it was not paid + this event.

Event

Details

Name

ventrata-bottom-bar-visibility

Description

fires when bottom bar is shown or hidden

Usage

document.addEventListener('ventrata-bottom-bar-visibility',
   (event) => {
      alert(`bottom bar visibility is ${event.detail.visible}`)
   }
 )

Event

Details

Name

ventrata-open-external-cart

Description

fires when the order reaches the Contact Details page before any contact details are entered

Usage

document.addEventListener('ventrata-open-external-cart',
   ({detail: {id}}) => 
       alert(`order ${id} created and flow is finished, now you can simulate redirect`
   )
)
Try out the Ventrata checkout yourself

Related Articles
Implementation Guide
Supported Configuration Inputs
Display Checkout on Element Click or Event Trigger
How to Create a Hybrid Cart Using the Checkout Widget
Integrating GetYourGuide Affiliate Activity Widget into Ventrata Checkout
Did this answer your question?