SOLVED: No possibility of targeting query for filters if it is a component

Bugs
1

Simple scenario.

I create a store with products I would like to filter.
I have created a filter list and a product card that displays the basic data in a grid. I wanted this product card to be in different places, so I made it a component. When I want to use the target query for the filters unfortunately nothing is displayed in the dropdown list for selection.

Of course, when the product card is not a component (when it is unlinked), this problem does not exist.
You can see this in the recording.

btw.

  1. just by chance an error crept in on the recording that the unlik component is not working as it should, so I had to refresh the page.
  2. by the way of this post another bug is that copying and pasting items doesn’t work properly. when a particular item is selected you can’t paste anything. when no item is selected, when you click cmd + v it pastes to the bottom.

Maybe it would be a good idea to introduce a new property “value” in the components here. And for example, link it under custom css id. Then it could be referred to which product card to select.

Admittedly, the choice of target query would have to be typed manually and not through the dropdown, or do it another way. But I think this is necessary for the very idea of compnents, so that they can be filtered, otherwise the use of the component in prioduct grids, however, misses the point and you have to stay with the traditional method.

1 Like
2

Hello @poziomapl,

thank you for the report. Yep, I could reproduce the issue, where you can’t connect the filters to the query loop defined in the component, and I’ve added it to the bug tracker.

About this one… can you record a video how to reproduce it, if possible, with only Bricks active ?

Thank you.
Matej

3

Is there a temporary work around for this right now as we are about to start a project that will use components cards in loops and filters.

4

No known workaround. Also, using components on live projects is not recommended, as they are still experimental.

Best regards,
Matej

1 Like
5

Hi guys,

We’ve fixed this issue in Bricks 2.0 alpha, now available as a manual download in your account (see changelog).

Please let us know if you are still experiencing issues.

As with any pre-stable release, please do not use it on a production/live website. It is only meant for testing in a local or staging environment.

1 Like
6

Hi, we tested with beta, but issue persist. Only pagination works, but filters don’t.

7

i agree with @glacierbloom, i’ve just tested the 2.0-beta, still no luck. only product pagination that can works.

8

Hi @glacierbloom and @ibnurasikh,

can you export your component and share it here? This task is about the query loop, if it’s set on the main element in the component. I just tested, and it should work?

Matej.

9

Hi @Matej here is example where search filter is not working:

{
“components”: [
{
“id”: “ocnloh”,
“category”: “”,
“desc”: “”,
“elements”: [
{
“id”: “ocnloh”,
“name”: “container”,
“parent”: 0,
“children”: [
“mlnwog”
],
“settings”: {},
“label”: “Container”
},
{
“id”: “mlnwog”,
“name”: “block”,
“parent”: “ocnloh”,
“children”: [
“ylrwph”,
“fjdred”
],
“settings”: {}
},
{
“id”: “ylrwph”,
“name”: “filter-search”,
“parent”: “mlnwog”,
“children”: ,
“settings”: {
“filterQueryId”: “fjdred”,
“filterApplyOn”: “change”
}
},
{
“id”: “fjdred”,
“name”: “div”,
“parent”: “mlnwog”,
“children”: [
“oeakyh”
],
“settings”: {
“hasLoop”: true,
“query”: {
“objectType”: “post”
}
}
},
{
“id”: “oeakyh”,
“name”: “heading”,
“parent”: “fjdred”,
“children”: ,
“settings”: {
“text”: “{post_title}”
}
}
],
“properties”: [
{
“label”: “Query 11”,
“type”: “query”,
“id”: “gpeohj”,
“connections”: {
“fjdred”: [
“query”
]
}
}
],
“_created”: 1748244337,
“_user_id”: 1,
“_version”: “2.0-beta”
}
],
“globalClasses”:
}

10

Hey,

I just need a component. You need to export it, and then you paste the .json file here (or share via any file sharing software).

Matej

11

Hi,

that is component, it’s combined with filters. Here is link to a file Please read

12

Hi,

I see. This is a different issue then the one in the first topic post, that was solved. You have your filter inside the component, and this is not supported (WIP: Filters inside a component not supported - #5 by Matej)

As for now, filter elements can not be placed inside the component, as they need to be unique.

Matej

13

Thank you, we were not aware that’s different issue.

14

Unfortunately it only works if it’s loop on main item of component. In our case we are using it for table generation so it has to be nested. It would be great if we could be able to target nested loops if we can’t nest filters inside of component.

15

Hi,

in this case, you are right. Connecting filter elements to the query loop, that it’s inside the component, is currently not supported.

Best regards,
Matej