Ticket Checkout

Open a checkout flow for ticket or day pass purchases.

Basic Usage


Copy
Loby.checkout({ type: 'TICKET' })

This opens the ticket checkout modal where users can select ticket types, quantities, and complete their purchase.

Parameters

Parameter	Type	Required	Description
`type`	string	Yes	Must be `'TICKET'`
`tickets`	array	No	Array of ticket types to pre-select. Each item has `ticketTypeId` (string) and `quantity` (number, defaults to 1). If omitted, the checkout opens with an empty selection.

Pre-selecting Ticket Types

You can pre-populate the checkout with specific ticket types and quantities:


Copy
Loby.checkout({
  type: 'TICKET',
  tickets: [
    { ticketTypeId: 'ticket-type-uuid-1', quantity: 2 },
    { ticketTypeId: 'ticket-type-uuid-2', quantity: 1 }
  ]
})

Example: Ticket Purchase Button


Copy
<section class="tickets">
  <h2>Visit Us Today</h2>
  <p>Purchase tickets for general admission.</p>
  <button id="buy-tickets">Buy Tickets</button>
</section>

<script>
  document.getElementById('buy-tickets').addEventListener('click', () => {
    Loby.checkout({ type: 'TICKET' })
  })
</script>

Handling Completed Orders

Listen for order completion:


Copy
Loby.addEventListener('orderCompleted', () => {
  console.log('Tickets purchased!')
  // Show confirmation message
  document.getElementById('message').textContent = 
    'Thank you for your purchase!'
})

User Flow

User clicks your "Buy Tickets" button
You call Loby.checkout({ type: 'TICKET' })
SDK displays the ticket selection modal
User selects ticket types and quantities
User enters payment details
SDK processes the payment
SDK emits orderCompleted event
User receives tickets via email