NO BUG: Interaction CSS Selector not selecting all

I have an interaction set for onclick, then remove attribute for #brxe-mtahpe ul li a

It doesn’t select all a elements, but when I use a selector for a single element, it works

Hello @abey

I just tested this interaction, and it removed the “data-test” attribute from all “h1” elements inside that #brxe-bgykyc.

Would be possible for you can copy-paste the section here for me to test (including the element where you have an interaction trigger).

Thanks.
Matej

Hi,

I later found a way.

the ID #brxe-mtahpe was for the nav nestable element. I skipped it and used the ul content block ID followed by li a

However, I still have a related issue, the toggle can’t return the attribute after removing it.

Is there a way I can have a toggle that can add/remove data-balloon value from aria-label an each element?

I don’t want to use custom code yet, it should be the last resolution.

Hi.

Ok, that’s good that you solved it. Now, for your current question, what if you use “toggle attribute” action? That one should added/remove it as needed.

Matej

Yes, it will work for a case where I have one value to give all list items.

Let me be clear now!

I have an aria-label and have a custom attribute for all the links in a Nestable Nav element. The custom attribute is a tooltip (data-balloon).
Each link has a different aria-label and custom attribute. I want to toggle it, but can’t make it possible since the interaction can only accept one value, no way to make it dynamic or get the aria-label value as the value to toggle it.

It seems custom JS code will work out but conflict is likely to occur.

Hi @abey,

yeah, now I understand! As you figured out, this is currently not possible. You can add it to the idea bord :slight_smile:
For now, the only way you can do that is to create a JS function, that will toggle these attributes on/off. You can run the function with interaction, to make it a bit more simple.

I’ll also mark this topic as a no-bug, since it’s not really a bug.

Thanks,
Matej

Okay, thanks.

I got some codes generated with AI but how do I insert it on the Bricks interaction feature?

I see different things with the code and Bricks interaction.

While I understand the code, I don’t understand how Bricks wants it before it can run.

Hi,

to execute a JS function with interaction, you will need to have that JS function loaded on the page, then you can just type the name of the function inside Function name field.

That should run the function on whatever trigger you need, in your case, on “click”.

Matej

1 Like