Skip to main content
Skip table of contents

LWC- Event Filter

Event Filter

The Event Filter component on the Lightning page allows users to filter the upcoming events based on specific criteria, such as Event Type, City, State, and Date Range so that users can refine their search and quickly find events that can meet their specific needs and requirements.

This component is available by drag and drop configuration. There are 2 properties available for this component to set.

Configuration Options

Learn more about Experience Builder here.

From the components list on the left panel, select the Event Filter component and drag it onto the site page.

On the page, click within the Event Filter component to bring up the Property editor.

Figure 1. Event Filter LWC with configuration properties



Header Labels for Filter

Enter the Header label that appears on top of the Event Filter component.

The header label is visible exclusively at the top only for the table layout.

Reset Action Label

Enter the label for the call-to-action button that prompts users to reset the filter for the event.

The "Reset" action label is a term used to describe a button or link that allows users to reset or clear the contents of the filter field and allow the user to start over and enter new information.

Users have the flexibility to name the "Reset" action label as they see fit.

How does Date Range work?

The Date Range is one of the Event filter parameters that seek input from the members for the Start Date and End Date of the Event. Start and End Dates refer only to the Event record's Start Date and filter out based on it. Example: If we have an Event A that has a Start Date of and Event B has a Start Date of and finally Event C has a Start Date of . If the member chooses the Start Date as and the End Date as on the Event Filter, then only Event A and Event B will show up as filter results. 


Figure 2.  Event Filter on Event Grid page with applied filter parameters

Use other LWCs from the Component list to create an impactful page for your constituents. For e.g. use the ‘Rich Content Editor’ to add supporting information about the Event Filter. For detailed steps on how to access and use Experience Builder, visit Experience Builder Overview (

See Also

Events Discovery in Experience Cloud

Lightning Web Components Library

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.