Ruby - How do I print HTML attributes

Question

I am trying to build a bootstrap carousel on my page. The carousel needs to look like this, with the first element having an active class.

  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

How do I achieve the same thing in Ruby? Can I print the data slide number, and the active class from the same statement.

  <ol class="carousel-indicators">
    <% @order_items.each_index do |n| %>
    <li data-target="#carousel-order-item" data-slide-to=<%= "#{n}";  (n == 0) ? "class="active"" : '' %>></li>
    <% end %>   
  </ol>

Thanks!

you probably should move the logic into an helper method

bjhaid
– bjhaid

2014-01-16 20:57:45 +00:00
Commented Jan 16, 2014 at 20:57 — bjhaid
– bjhaid, Commented Jan 16, 2014 at 20:57

MrPizzaFace · Accepted Answer · 2014-01-16 21:10:49Z

2

Try this and comment back with your results so that I can further assist you.

<% @order_items.each_index do |n| %>
  <li data-target="#carousel-order-item" data-slide-to="<%= n %>" 
  <%= "class=\"active\"" if n == 0 %> ></li>
<% end %>

This works as such

order_items = %w{ mice rice lice }

order_items.each_index do |n| 
  puts n
  puts "class=\"active\"" if (n == 0)
end

When n == 0 then class="active" will be output.

edited Jan 16, 2014 at 21:10

answered Jan 16, 2014 at 20:52

MrPizzaFace

8,12616 gold badges85 silver badges125 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

learning_to_swim Over a year ago

Great, thanks! See my comment to Andrew above, about the double quotes, but other than that, this works.

MrPizzaFace Over a year ago

@learning_to_swim try the code now. I escaped the dbl quotes. The output should be proper. Happy coding :)

Andrew Wei · Accepted Answer · 2014-01-16 20:48:41Z

1

I think this is what you want

<li data-target="#carousel-order-item" data-slide-to="<%= n.to_s %>" <%= if (n == 0) ? 'class="active"' : '' %> ></li>

answered Jan 16, 2014 at 20:48

Andrew Wei

2,1201 gold badge18 silver badges30 bronze badges

1 Comment

learning_to_swim Over a year ago

Thanks Andrew. The single quotes around the 'class="Active"' is adding double quotes around Active, to make it class=""Active"". So I just have 'class=Active' now and the HTMl appears right. Also, any reason why you have the to_s in there.

computer_smile · Accepted Answer · 2014-01-16 21:00:55Z

1

Well this is just going to be an array so what about just getting the index of each element? Something like-

<ol class="carousel-indicators">
    <% @order_items.each do |n| %>
    <li data-target="#carousel-order-item" data-slide-to="<%= n.index %>" class="<%= 'active'if n.index == 0 %>"></li>
    <% end %>   
  </ol>

answered Jan 16, 2014 at 21:00

computer_smile

2,2872 gold badges27 silver badges46 bronze badges

Collectives™ on Stack Overflow

Ruby - How do I print HTML attributes

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related