slim dynamic conditional class

Question

Just to help other developers, because there is no similar question on SO.

div class=(is_active? ? 'active' : 'inactive')
div class=('active' if is_active?)

Sergey Alekseev · Accepted Answer · 2017-07-28T10:21:26.480

155

See the examples below:

div class=(is_active? ? 'active' : 'inactive')
div class=('active' if is_active?)

The same approach can be used to assign dynamic values to other attributes.

edited Jul 28 '17 at 10:21

answered Apr 10 '13 at 17:48

Sergey Alekseev

11,910
11
38
53

2

How would you do that for multiple conditions? – Maxim Zubarev Jan 24 '14 at 18:47
See below in the comments to your answer. – Sergey Alekseev Jan 24 '14 at 22:58
5

This can also append a class, such as: `div.councilor class=(councilor.retired? ? "retired" : "")` generates: `div.councilor.retired` – Terra Ashley Jul 13 '16 at 04:31

score 23 · Answer 2 · answered Feb 02 '14 at 20:20

I use array of classes and nil element if there is no need to include class in list, then compact array to remove nil elements and finally join all together.

div class=(["cday", "col-md-1", day.day == 1 ? "col-md-offset-#{day.cwday-1}" : nil].compact.join(' '))

score 12 · Answer 3 · answered Jan 24 '14 at 18:56

12

If you have multiple conditions I am doing right now something like

div class=(('foo ' if is_foo?) + ('bar' if is_bar?))

Though I feel it to be a blemish if is_bar? return false and the generated HTML results in

<div class="foo "></div>

(the blemish is the blank character after the foo). If someone had a solution for that would be awesome.

answered Jan 24 '14 at 18:56

Maxim Zubarev

2,403
2
29
48

7

Try `String#rstrip` in this case with 2 conditions: `div class=((('foo ' if is_foo?) + ('bar' if is_bar?)).rstrip)`. Or `div class=([('foo' if is_foo?), ('bar' if is_bar?)].compact.join(' '))` for several conditions. – Sergey Alekseev Jan 24 '14 at 22:55

slim dynamic conditional class

3 Answers3

Linked