Filtering SharePoint drop-down menu

Lets explore how you can use the filtering capabilities of a SharePoint drop-down menu

Updated over a week ago

The SharePoint data component is a powerful component that can be user to show data coming from any datasource. However data sources often contain thousands of rows which means it can be helpful to filter this data so that users can see whats most important. You can do so using the steps below:

  1. Navigate to the data tab of the component settings

  2. Under the advanced settings you should see a "Filter Query" option which will accept a Javascript expression to filter components by

Type an expression based on the structure on the structure of the data from your SharePoint data source. In the example below we have a list of vehicles with multiple columns and will filter the list for only a specific make (Ferrari). The Sample Item field is a good reference to show what fields to reference in your expression.

show = item.Make === 'Ferrari'

Its important to note the capitalisation if the fields used by your data source as the JavaScript expression is case sensitive.


The code will run your expression for every row in your data source to determine weather it should appear in the drop-down menu. From the example above a few variables are reference which are described below.

Variable

Description

show

Your expression should set the value of show to true of false in order to control weather an item should show in the drop-down menu.

item

The item variable is the JSON object representing a row in your data source. The sample Item shows an example of an item for your specific data source. You can use item.FieldName notion to reference the various fields/columns of your datasource.

Did this answer your question?