Change row background color stripe in repeat

hi
i am trying to do a striped row effect in a row repeater, like the table stripe, but just cannot get my head around it.

I know it will involve a class toggle but how to do i set the class to go bg-light, bg-dark, bg-light etc for each row.

thanks for any pointers

You just apply the class and the condition on the element:
Screenshot 2024-04-22 at 11.44.34

yeah, how do i deal with changing the condition, i assume some variable, so vartoggle=1, then check vartoggle==1, but to reset vartoggle to = 0 somehow in the repeater for the the next row, thats the bits i can get my head around, thanks

Sorry i don’t really understand what do you mean?

how do i set the dynamic value to go 1 , 0, 1, 0 ,1 to toggle the class based on the dynaamic value

You can use the modulus operator: %
e.g.

$index%2

modulus gives the remainder from the division sum. For every 3 use %3 etc.

or for something different for each of 3 use 3 dynamic attributes:

$index%3 == 0
$index%3 == 1
$index%3 == 2

thanks, but i just don’t get it, sorry, i thought/imagined ben at one point did a video on it, changing row background colour in a repeat to be stripped, but cannot find it, i saw him post a bug about class toggle not working and in his video of the error i could see he was using 1==1 and then something else, but might be going up the wrong tree. I know i;m stupid when it comes to this stuff, just hadn’t thought it would be quites so hard to stripe a row background, thanks

If you are just using 2 classes bg-light and bg-dark it would be:

  1. Add a dynamic class for bg-light
  2. Set the condition (using code view) to $index %2 == 0
  3. Add a dynamic class for bg-dark
  4. Set the condition (using code view) to $index %2 == 1

It will end up like @teodor’s screenshot above, but instead of dynamic_value you’ll have the $index %2 == 0 or $index %2 == 1

2 Likes

thanks, didnt seem to work for me tho

ignore that, its workign now, copy paste didnt work, but when i then hit the filter button and selected it, it updated it and now it works :slight_smile: woo hoo, thanks for much

It’s all been entered as a string, you need to use code view to type it/paste as an expression:

1 Like