Filter Events
Filter events using a dropdown element.
Intermediate
Last updated: 13 Aug 2025
About
In this example, we create a dropdown element that visitors can use to filter a list of events by location.
Before you begin
To use this example:
- You must install Wix Events & Tickets on your site.
- Your site must have an event category for each unique event location.
- Your site must have events from different categories.
APIs
How we built it
We added the following to our site:
Page Elements
Home
- A Wix Events element to display a list of events.
- A dropdown to filter the displayed events.
Frontend Code
Home
The code in this file allows visitors to use the dropdown to filter the list of events. This code fills out the dropdown with options based on events categories, and then enables visitors to filter by those options.
In this file, we
-
Query the Events/Categories database and map the results into a list of dropdown options:
-
The category’s name is displayed to visitors as an option in the dropdown.
-
The category’s id is saved as the value for that option.
-
-
Populate the dropdown with these options.
-
Set the dropdown to filter the events shown by setting the Wix Events element’s categoryId property to the selected option’s value. This action will show only events that belong to that category.
Code Snippets
Home
Get Help
Join the community
Join the Wix Studio community on Discord, where experienced developers and fellow creators come together to share tips, troubleshoot issues, and collaborate.
Hire a developer
Building a coded solution on your own can be challenging. Let an experienced Wix developer build it for you, so you can keep working on your site or business. Visit the Wix Marketplace to find a trusted developer.