# Filter AND/OR Logic \[NEW]

By default, all filter controls, such as [Text Filter](https://docs.getdatagrid.com/controls/text-filter), [Checkbox Filter](https://docs.getdatagrid.com/controls/checkbox-path-filter), and so on, use AND logic. The AND logic means that the result list meets **all criteria** within a set of filter and path rules.

But it is possible to change this behavior with a **customFilter** property like this: 

{% code lineNumbers="true" %}

```javascript
datagrid({
    customFilter: `
        { location } and { place-title } and
        ({ exclusive } or { parking } or { delivery }) and
        ({ family } or { romantic } or { party })`,

    // ... any other DataGrid setting ....
});
```

{% endcode %}

{% hint style="info" %}
You can use any combination of **and**, **or**, and **parentheses**.
{% endhint %}

Each parenthesized token, such as `{ location }`, corresponds to a filter control. The value inside parentheses matches **data-id** property of the control.

There is only one exception: in the case of the [Radio Button Filter control](https://docs.getdatagrid.com/controls/radio-button-path-filter), the **name** property is used instead of **data-id**.

{% hint style="info" %}
**data-id** may contain English letters, numbers, dashes or underscores only.
{% endhint %}

{% code title="For example:" lineNumbers="true" %}

```html
<!-- text filter control: data-id="location" -->
<input
        type="text"
        placeholder="Filter by location"
        data-grid-control="text-filter"
        data-path=".my-path-to-filter"
        data-id="location" />

<!-- radio button control uses name instead of data-id -->
<input
        type="radio"
        name="color-radio"
        data-grid-control="radio-filter"
        data-path=".color-red"
/>
```

{% endcode %}

{% hint style="info" %}
You can find working examples in the downloaded archive under **/main/6-filters-and-or-logic/**.
{% endhint %}