top of page
Custom Event Ticket Picker on Events Frontend

Custom Event Ticket Picker on Events Frontend

Create a custom ticket picker for your events.

Intermediate.png

Intermediate

1K

Published:

January 16, 2024

Girl Enjoying her Drink

by

Anchor 1
Hire a Developer

Example Description

In this example, we created a customized ticket picker, that redirects the site visitors to the default Wix Events widget checkout page.

Example Code

Tab 1

.

Tab 2

.

Tab 3

.

This code solution can be complicated.

How We Built It

Database Collection:

In this example, we use the “Events/Categories” and “Events/Events” database collections. When installing Wix Events & Tickets on your site, these collections are automatically added.


Data Connections:

We added an “Events/Tickets” dataset to connect the “Events/Tickets” collection to the repeater for displaying tickets.


Page Elements:

We added the following elements to our site:

  • Repeater: Displays event tickets.

  • Text: Displays ticket name and price.

  • Dropdown: Used to select the ticket quantity.

  • Button: Used to reserve tickets.


Code:

We added the following code to our site:

1. Set up the repeater to fetch ticket data from the Tickets dataset. 

2. After clicking the Buy Tickets button, 

   2.1. Fetch the event ID from the Events dataset.

   2.2. Add the selected ticket quantity along with the ticket type ID to the array.

   2.3. Reserve the tickets. Redirect the site visitor to the Wix Events checkout page by passing the event slug and reservation ID.


Note: To get the event slug, run the getEvent() function.

APIs We Used

Non-code example.

Non-code example.

Non-code example.

Non-code example.

Related Articles

Article Link

Hire a Developer

Velo solutions are powerful tools, but building them on your own can be challenging. Let an experienced Velo development shop build it for you, so you can keep working on your site or business.

Related Examples

Did this help?

Yes

|

No

Thanks for your feedback!

Custom Event Ticket Purchase Flow

Custom Event Ticket Purchase Flow

Create a custom ticket purchase flow without using the Wix Events widget

Intermediate.png

Intermediate

Filter events by category

Filter events by category

Create a filter to filter events by assigned categories.

Intermediate.png

Intermediate

Anchor 2
bottom of page