single_filter¶
The single_filter
macro is used to render a set of single choice list filters.
Definition¶
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 %}