Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Haml: how do I set a dynamic class value?

Tags:

I have the following html.erb code that I'm looking to move to Haml:

<span class="<%= item.dashboardstatus.cssclass %>" ><%= item.dashboardstatus.status %></span>

What it does is associate the CSS class of the currently assigned status to the span.

How is this done in Haml? I'm sure I'm missing something really simple.

like image 793
Tim Sullivan Avatar asked Aug 08 '08 19:08

Tim Sullivan


People also ask

How do you apply dynamic class to an element?

In this article, we will see how to dynamically create a CSS class and apply to the element dynamically using JavaScript. To do that, first we create a class and assign it to HTML elements on which we want to apply CSS property. We can use className and classList property in JavaScript.

How do I change a dynamic class in CSS?

How to apply/change CSS dynamically? The following is the Javascript function that accepts a parameter and then gets the id of the element and compares the name of the class using className property and depending on the value it assigns a new value to the element.

How do I give a HAML ID?

In Haml, we write a tag by using the percent sign and then the name of the tag. This works for %strong , %div , %body , %html ; any tag you want. Then, after the name of the tag is = , which tells Haml to evaluate Ruby code to the right and then print out the return value as the contents of the tag.


2 Answers

Not sure. Maybe:

%span{:class => item.dashboardstatus.cssclass }= item.dashboardstatus.status
like image 131
Christian Lescuyer Avatar answered Oct 14 '22 02:10

Christian Lescuyer


You can do multiple conditional class selectors with array syntax:

%div{ class: [ ("active" if @thing.active?), ("highlight" if @thing.important?) ] }

like image 45
Cristian Rennella Avatar answered Oct 14 '22 02:10

Cristian Rennella