Prompts API
Implement your own custom dialogs for selecting places and ticket types.
While the API strives to be a simple as possible, you still need to build a lot of UI components that we cannot debug for you.
If your dialogs do not work correctly, ticket buyers will not be able to select their seats. Only proceed to integrate your own dialogs if you know what you are doing.
Introduction
There are three callbacks that can be defined:
If a callback is defined, the Seats.io embed will stop showing the type of dialogs responsible of handling that kind of prompt, and call the provided function instead.
For instance, if a user clicks on a General Admission area with no ticket types, a dialog with plus and minus buttons will be displayed within the iframe. If onPlacesPrompt is defined in the config, then the dialog will not be shown and your function in onPlacesPrompt will be called instead.
Displaying a dialog
It is up to you to display a dialog, banner, drawer or any kind of UI container and elements to present the information to the ticket buyer, as well as recording the decisions taken within the dialog so that when the user confirms their choice, you can use the confirmSelection callback to instruct Seats.io how to proceed, or simply close your dialog if the user decides not to proceed.
Confirming a selection
Each callback provides a first parameter describing the selection to be prompted, and a second parameter referred to as confirmSelection.
This second parameter is a function and should be called once the user has made their choice within your dialog. The confirmSelection for each callback supports different parameters, as prompts request different choices to be made: choose a number of places, choose a ticket type, or assign places to ticket types.
Tips for a good integration
Make sure the choices made in your dialog are valid before confirming selection. Seats.io will not display an error to the user if the selection made by your dialog is invalid, which can confuse users and prevent them from picking their seats. For instance: a Variable Occupancy area requires at least 2 places to be selected, but only 1 was selected.
Chart interaction is not paused after a callback is triggered. Depending on what kind of dialog you are implementing, you might want to put an overlay on top of the chart to capture any mouse or touch interactions to prevent the user from interacting with the chart while your dialog is displayed.