I have a repeat region using the accordion cards component. I would like to be able to click on each card individually and toggle a dynamic collapse for the one card. Instead all of the cards toggle. This is because they all have the same ID, so accordion1_collapseOne.toggle() opens all of them. How can I have a dynamic ID instead so I can open each card individually?
Thanks!
Add the $index to the ID , like card[{{$index}}]
Great thank you. But how would I then get the button to trigger this? An option does not appear:
I would assume I would need to somehow select $index?
Click Dynamic Attributes and choose Name. Then for the Value you choose the $index under the Repeat. Once you have done that, go into code view and change dmx-bind:name= to dmx-bind:id=
Sorry, I cannot think of a better way.
Alright I’ve tried a few things with no luck. Any thoughts on my code?
What I’m thinking is that I need an “on click” for the button? I’ve tried a few things but nothing has worked so far.
I think your button should look like this:
<button class="btn btn-primary" dmx-on:click="toggler.setValue((toggler.value == -1 || toggler.value != $index) ? $index : -1)" dmx-show="omschrijving!='<p><br></p>'">{{Username}}</button>
But modified for collapse of course
I (finally) figured out a way to do this in wappler without adding code:
Create a variable that is populated by button click with $index
add a class toggle to the card body:
Thank you all for your help!
I’m running into a similar situation except with a checkbox repeating group that’s populated from the DB by a server connection:
The issue is that the ID for the repeated group is duplicated. In this case, only Test1 should be checked off. When I edit the HTML in the Chrome Inspector and make the ID unique it works correctly.
The question is, how to do the same thing in Wappler. I am guessing I need to enter the dynamic ID on the Custom Checkbox repeating group element, but not sure how to do that or whether that’s even close to correct.
Hi @nepatriot,
The solution should be the same concept. You first need some unique ID (either $index or primary key on your db). I don’t know exactly which dynamic attribute can trigger a check box but this should be possible.
Hi @nepatriot, you can try @ben’s solution.
e.g. you can set the ID’s as:
dmx-bind:id="input_{{$index}}"
