Ruby slim - class for a div from variable

Question

I am aware of this post here:

Ruby Slim - How do you define an element's class with a rails helper or variable?

and I have tried all three solutions. For me unfortunately not one of them is working.

forum.rb

.panel
  .panel-heading
    .span  = @forum.name
  .panel-body
    .row 
      .col-md-7 #{t('global.topic')}
      .col-md-3.value.title 
      .col-md-1.value.topic 
      .col-md-1.value.date

forum_feed.js.coffee

window.ForumFeedUI = flight.component ->
  @defaultAttrs
    titleSelector: '.value.volume'
    topicSelector: '.value.topic'
    dateSelector: '.value.date'

  @refresh = (event, data) ->
    @update @select('volumSelector'), data.volume
    @update @select('topicSelector'), data.topic
    @update @select('dateSelector'), data.date

It all works as expected when I want to print the variables as text on the website. However I need the divs containing as well the variable for the title. Whatever I try I am unable to get the divs class with the variable of the title.

I believe I need to create a helper something along these lines and a content_tag:

content_tag(:div, content_tag(:p, "Hello world!"), class: "strong")


div = t(".#{forum_title title}")


def forum_title(title, &block)
  content_tag :div, class: "col-md-3-#{title}" do
    capture(&block)
  end
end

Destefano

On which line exactly you're expecting to have a dynamic class? – Verbality

@ .col-md-1.value.title – Destefano

I am sorry but all the methods listed on the link you've posted works for me. I am sure that there's something wrong with the variables you've set. Please note that variables should be Ruby variables and not a JavaScript Variables! – Verbality

Answer 1

you could try:

.col-md-7 class="your-#{dynamic class}"

Overstate

this gives me an empty class – Destefano

this should give <div class="col-md-7 your-something_from_variable"></div> – Overstate

Answer 2

Use the alternate [] notation for css attributes.

These three lines are equivalent:

.col-md-6.title#foo Some content

div.col-md-6.title#foo Some content

div[class="col-md-6 title" id="foo"] Some content

For the last one, you can put Ruby #{} into the quotes, thus you can do this:

- myclass = "col-md-6"
div[class="#{myclass} title" id="foo"]

And IMO that's the easiest answer.

Elegy