# Filterable Properties

Umbraco UI Builder can dynamically build a filter dialog choosing appropriate editor views for you based on a basic property configuration. Properties of a number or date types will become range pickers and enums. Properties with options defined will become select/checkbox lists and all other properties will become text input filters.

![Filterable Properties](https://2059272600-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fj6FmBruCSGbXJIJB2aRu%2Fuploads%2Fgit-blob-e47add24c4100ac7ab022a33a8c0b588db832af9%2Ffilterable_properties.png?alt=media\&token=80aa8e0b-3460-41ee-b402-6d88ec8dcbb8)

## Defining filterable properties

Defining filterable properties is controlled via the [collections](https://docs.umbraco.com/umbraco-ui-builder/13.latest/collections/overview) configuration.

### **AddFilterableProperty(Lambda filterablePropertyExpression, Lambda filterConfig = null) : CollectionConfigBuilder\<TEntityType>**

Adds the given property to the filterable properties collection.

```csharp
// Example
collectionConfig.AddFilterableProperty(p => p.FirstName, filterConfig => filterConfig 
    // ...
);
```

## Changing the label of a filterable property

### **SetLabel(string label) : FilterablePropertyConfigBuilder\<TEntityType, TValueType>**

```csharp
// Example
filterConfig.SetLabel("First Name");
```

## Adding a description to a filterable property

### **SetDescription(string description) : FilterablePropertyConfigBuilder\<TEntityType, TValueType>**

```csharp
// Example
filterConfig.SetDescription("The first name of the person");
```

## Defining basic options for a filterable property

### **SetOptions(IDictionary\<TValueType, string> options) : FilterablePropertyConfigBuilder\<TEntityType, TValueType>**

```csharp
// Example
filterConfig.SetOptions(new Dictionary<string, string> {
    { "Option1", "Option One" },
    { "Option2", "Option Two" }
});
```

## Defining options with custom compare clauses for a filterable property

### **AddOption(object key, string label, Lambda compareExpression) : FilterablePropertyConfigBuilder\<TEntityType, TValueType>**

```csharp
// Example
filterConfig.AddOption("Option1", "Option One", (val) => val != "Option Two");
```

## Configuring the mode of a filterable property

For filterable properties with options you can configure whether the options should be multiple or single choice.

### **SetMode(FilterMode mode) : FilterablePropertyConfigBuilder\<TEntityType, TValueType>**

```csharp
// Example
filterConfig.SetMode(FilterMode.MultipleChoice);
```
