How can I declare a data-attribute using ERB? - ruby-on-rails

This is the HTML I am trying to replicate:
<div id="links">
<a href="images/banana.jpg" title="Banana" data-gallery>
<img src="images/thumbnails/banana.jpg" alt="Banana">
</a>
</div>
I'm not sure how to do the data-gallery bit. How would I write such a thing with ERB?
Here's what I have so far:
<div id="links">
<% for photo in #photos %>
<%= link_to (image_tag photo.image.url(:medium))%>
<% end %>
</div>

<div id="links">
<% #photos.each do |photo| %>
<%= link_to (image_tag photo.image.url(:medium)), 'data-gallery' => true%>
<% end %>
</div>
Notice the more Rubyish way of iterating through an array of objects with each.

Add "data_gallery" => "value" to your link_to in HTML block.

Related

Using Loop Variable to Set the id Attribute

I have the following code:
<% #electives.each do |elective| %>
<div>
</div>
<% end %>
I would like to set the id of the div to elective.name, but I don't know how to do it, or whether this works:
<% #electives.each do |elective| %>
<div id="elective.name">
</div>
<% end %>
Is it possible to do this in Rails?
Thanks.
You can use <%= ruby variable %> block within erb file to add ruby values within your pages
<div id="<%= elective.name %>">
As an alternative solution, you can use the rails tag helper
<% #electives.each do |elective| %>
<%= tag.div id: elective.name do %>
...
<% end %>
<% end %>

How to pass an instance variable into a view partial?

Right now I have a loop that contains code I do not wish to repeat for each instance variable. I wish to put this in a partial and reuse it by changing the #new_posts instance variable, so I can use the same template for #featured_posts and #recommended_posts that I have defined.
I'm thinking of something like this:
<%= render "posts", posts: #featured_posts %>
An example of a loop that I wish to store in a partial
<% #new_posts.each do |post| %>
<div class="col-sm-4">
<div class="thumbnail">
<img src="#">
<div class="caption">
<h4><%= link_to post.title, post %></h4>
<%= post.text.truncate_words(60, omission: '...') %>
Button
</div>
</div>
</div>
<% end %>
How should I approach this? Thanks for your help!
Assign whatever variable you want to posts
<%= render "posts", posts: #featured_posts %>
And now loop over posts in the partial. You will have #featured_posts in posts variable now
<% posts.each do |post| %>
<div class="col-sm-4">
<div class="thumbnail">
<img src="#">
<div class="caption">
<h4><%= link_to post.title, post %></h4>
<%= post.text.truncate_words(60, omission: '...') %>
Button
</div>
</div>
</div>
<% end %>
For #recommended_posts render the same partial but pass #recommended_posts to posts
<%= render "posts", posts: #recommended_posts %>

Rails loop not generationg grids

I have a loop that iterates through a list of stories but it's generating one row per story and not 3 columns. What am I missing?
<div class="row">
<div class="col-md-4">
<% #stories.each do |story| %>
<h2><%= story.name.titleize %></h2>
<%= image_tag story.pictures.first.image(:medium).to_s, class: "img-responsive" %>
<%= link_to "View Story", story_path(story) %>
<% end %>
</div>
</div>
Thanks.
I think you're placing the each loop in the wrong place. Try something like:
<div class="row">
<% #stories.each do |story| %>
<div class="col-md-4">
<%= content_tag :h2, story.name.titleize %>
<%= image_tag story.pictures.first.image(:medium).to_s, class: "img-responsive" %>
<%= link_to "View Story", story_path(story) %>
</div>
<% end %>
</div>
Take a look to each_slice
#stories = [story1, story2, story3, story4, story5, story6, story7, story8]
#stories.each_slice(3).to_a
#=> [[story1, story2, story3], [story4, story5, story6], [story7, story8]]
I think you can try this:
<% #stories.each_slice(3).to_a.each do |row_stories| %>
<div class="row">
<% row_stories.each do |story| %>
<div class="col-md-4">
<%= content_tag :h2, story.name.titleize %>
<%= image_tag story.pictures.first.image(:medium).to_s, class: "img-responsive" %>
<%= link_to "View Story", story_path(story) %>
</div>
<% end %>
</div>
<% end %>

Ruby on Rails - dynamic navigation with link_to in a div

I want to add navigation to a series of div, which are loaded dynamically.
For this I am using link to covering the div and passing it the attribute to the method.
The problem is that when I press on the div the attribute does not correspond.
I put the code.
With this code all it's ok, but i don't have the link in the div.
<%for i in inicio..final %>
<div class="col-md-3">
<div class="tarjeta_comercio">
<%= link_to 'mezcla/mostrar_institucion', {:controller => "mezcla", :action => "mostrar_institucion", :institucion_actual => #institucions[azar[i]].id} %>
<div class="foto">
<%= image_tag #institucions[azar[i]].logo.url(:original) %>
</div>
<div class="titulo">
<%= #institucions[azar[i]].nombre %>
</div>
<% end %>
But the problem is when i do a block with "link_to...do-div-end". If i do this the parameter don't run. I don't explain why this happen. This is the wrong code.
<%for i in inicio..final %>
<div class="col-md-3">
<div class="tarjeta_comercio">
<%= link_to 'mezcla/mostrar_institucion', {:controller => "mezcla", :action => "mostrar_institucion", :institucion_actual => #institucions[azar[i]].id} do %>
<div class="foto">
<%= image_tag #institucions[azar[i]].logo.url(:original) %>
</div>
<div class="titulo">
<%= #institucions[azar[i]].nombre %>
</div>
<% end %>
<% end %>
In :institucion_actual each time put 0 (when i pulsed over).
Thanks.

link_to tag not including all divs

I currently have a link to tag which should wrap around all the content within it, but currently it's not doing that. It's wrapping around the code until it hits another div with a rails query inside it?
index.html.erb
<% #posts.each do |post| %>
<div class="widget" >
<%= link_to post do %>
<div class="image b-lazy" data-src="<%= post.image %>">
</div>
<div class="caption">
<h4><%= post.title %></h4>
<p>by <%= post.affiliate %></p>
</div>
<!-- LINK TO TAG ENDS HERE FOR SOME REASON -->
<div class="caption-top">
<% post.categories.each do |category| %>
<%= link_to category_path(category) do %>
<div class="tag <%= category.name %>"><%= category.name %></div>
<% end %>
<% end %>
</div>
<% end %>
</div>
Any help is appreciated!
Jonathan
Two things:
You are using link_to inside another call to link_to. That is probably not what you want.
The result of a block will be what you return from a block, normally the last line. Take a look at this question for a solution.

Resources