Skip to content

single_filter

The single_filter macro is used to render a set of single choice list filters.

Definition

{% single_filter(filter, options) %}

Input parameters

filter

Filter Filter object representing a filter to render.

options

object represents an object of single filter attributes

Option key Type Default Required Description
options.instanceId string "" yes An id necessary to make a filter unique. Usually it can just be the module instance id
options.showCounters boolean false no If set to true a number of items meeting criteria of a given filter will be displayed

Example

In this example we render a simple single filter based on a news filter from Object Api on a product list view. If using the macro inside a module we can pass a moduleInstance as an instanceId parameter. As specified earlier, usually it does the job.

{% from "@macros/single_filter.twig" import single_filter %}

{% set filters = ObjectApi.getFilters() %}

{{ single_filter(filters.newsFilter, {
    instanceId: moduleInstance
}) }}

Example

In this example we render a very similar single filter but this time with counters.

{% from "@macros/single_filter.twig" import single_filter %}

{% set filters = ObjectApi.getFilters() %}

{{ single_filter(filters.newsFilter, {
    instanceId: moduleInstance,
    showCounters: true
}) }}

Macro source code

{% macro single_filter(filter, options) %}
    {% from "@macros/radio.twig" import radio %}

    {% for filter in filter.values %}
        {% if loop.first %}
            {% set clearFilterId = filter.urlKey ~ options.instanceId %}

            <div class="filter-control">
                <div>
                    <div class="control">
                        {{ 
                            radio({
                                id: clearFilterId,
                                label: translate('Do not use this filter'),
                                name: filter.urlKey,
                                value: '',
                                checked: not filter.isActive
                            }) 
                        }}
                    </div>
                </div>
            </div>
        {% endif %}

        {% set filterId = filter.urlKey ~ filter.urlValue ~ options.instanceId %}

        <div class="{{ html_classes('filter-control', { 'filter-control_empty': options.showCounters and filter.counter is defined and filter.counter <= 0 }) }}">
            <div>
                <div class="control">
                    {{ 
                        radio({
                            id: filterId,
                            label: filter.name,
                            name: filter.urlKey,
                            value: filter.urlValue,
                            checked: filter.isActive
                        }) 
                    }}
                </div>
            </div>

            {% if options.showCounters and filter.counter is defined %}
                <span class="filter-control__counter">{{ filter.counter }}</span>
            {% endif %}
        </div>
    {% endfor %}
{% endmacro %}