how to convert this ruby on rails code to include html as well - ruby-on-rails

How can I take this..
<li>
<%= link_to image_tag(product.photo.url(:small)), product_path(product.id, :forum_id => params[:forum_id]) %>
<% if params[:forum_id] %>
<%= link_to "Add", addtoforum_user_path(:products => [product.id],:forum_id => params[:forum_id], tp: "add") %>
</li>
to be like this.. (right now it is only inlcluding the image)
<li>
<a href="">
<figure>
<img src="image-url....">
</figure>
<span>product name</span>
</a>
</li>
Thanks

Not sure I understand the question but I guess the issue is to output the figure, img tags etc inside the a tag?
This can be achieved by passing a block to the link_to method, like this:
<li>
<%= link_to product_path(product.id, :forum_id => params[:forum_id]) do %>
<figure>
<%= image_tag(product.photo.url(:small)) %>
</figure>
<span><%= product.name %></span>
<% end %>
</li>

Related

Best way to show empty lists in Rails

I have been working to follow the best practices in Rails in order to save time in the future.
I am displaying all terms in a view which has more than 0 results.
<% #terms.each do |t| %>
<li class="media">
<div class="media-body">
<div class="media-heading text-semibold"><%= link_to "#{t.name}", authenticated_root_path %></div>
<span class="text-muted"><%= link_to 'Settings', edit_account_term_path(#account, t) %></span>
</div>
</li>
<% end %>
What is the best way to display a different view if the term count is zero? I could do something like a simple if statement in the view doing a count but that seems cluttered. Any suggestions?
How about this:
<% #terms.each do |t| %>
<li class="media">
<div class="media-body">
<div class="media-heading text-semibold"><%= link_to "#{t.name}", authenticated_root_path %></div>
<span class="text-muted"><%= link_to 'Settings', edit_account_term_path(#account, t) %></span>
</div>
</li>
<% end.empty? and begin %>
<li class="media">
<!-- nothing to see -->
</li>
<% end %>
You can also move the code to a partial.
<%= render(:partial => 'terms', :collection => #terms) || 'There are no terms' %>
The partial:
<li class="media">
<div class="media-body">
<div class="media-heading text-semibold"><%= link_to "#{term.name}", authenticated_root_path %></div>
<span class="text-muted"><%= link_to 'Settings', edit_account_term_path(#account, term) %></span>
</div>
</li>
</li>

Get from the link_to an array of values Ruby on Rails

<i class="dropdown icon"></i>
<div class="menu">
<% #dogs.each do |dog| %>
<%= link_to dog[:name], params.merge(dog_id: dog[:id], page: nil), class: 'item' %>
<% end %>
</div>
</div>
I'm working on a project, I need to add to the params by clicking the id array with one key. Tried like this, but leads to unexpected results, I ask for help.
<i class="dropdown icon"></i>
<div class="menu">
<% #dogs.each do |dog| %>
<%= link_to dog[:name], params.merge(dog_id: params.push(dog[:id]), page: nil), class: 'item' %>
<% end %>
</div>
</div>
I understand what should look like this
<%= link_to dog[:name], params.merge(dog_id: [0, 1, 4, 6], page: nil), class: 'item' %>
But I can not realize. Thanks!

Nested html with content_tag

I want to get this html using content_tag or content_tag_for:
<a href="javascript:;" class="nav-link ">
<%= fa_icon 'book', 'aria-hidden': true %>
<span class="title">Courses</span>
</a>
I could put fa_icon inside link_to, but don't know how to put span. And if it is not doable, what if i do this way:
<a href="<%=courses_path%>" class="nav-link ">
<%= fa_icon 'book', 'aria-hidden': true %>
<span class="title">Courses</span>
</a>
Why not the following?:
<%= link_to "javascript:;", class: "nav-link" do %>
<%= fa_icon 'book', 'aria-hidden': true %>
<%= content_tag :span, "Courses", class: "title" %>
<% end %>
I would try link_to ... do. Because it's a standard approach that's more descriptive than content_tag I think it will be easier to understand the original intent of the code when you come back 2 years from now to do maintenance.
Here's what your snippet might look like, to get you going:
<%= link_to courses_path, class: 'nav-link' do %>
<%= fa_icon 'book', 'aria-hidden': true %>
<span class="title">Courses</span>
<% end %>
Here is the documentation for Rails 4.2: http://apidock.com/rails/v4.2.1/ActionView/Helpers/UrlHelper/link_to

Rails each method with changing html (bootstrap carousel)

So, I'm trying to figure out a solution for Bootstrap 3's carousel in Rails 4.
I've got this:
<li> <a id="carousel-selector-0" class="selected">
<%= image_tag #gallery.images[0].photo.url(:thumb), class: 'img-responsive' %>
</a></li>
<li> <a id="carousel-selector-1">
<%= image_tag #gallery.images[1].photo.url(:thumb), class: 'img-responsive' %>
</a></li>
...etc...
I'm looking for an each type method that would account for a variable number of images in a gallery.
Something where the first photo looks like this:
<li> <a id="carousel-selector-0" class="selected">
<%= image_tag #gallery.images[0].photo.url(:thumb), class: 'img-responsive' %>
</a></li>
And those after it look like:
<li> <a id="carousel-selector-1">
<%= image_tag #gallery.images[1].photo.url(:thumb), class: 'img-responsive' %>
</a></li>
.......
With each number increasing by one for each photo of course.
Thanks for the help!
SOLUTION
Thank you kindly creativereason!
Heres what worked:
<% #gallery.images.each_with_index do |image, index| %>
<li> <a id="carousel-selector-<%=index%>" class="<%= 'selected' if index == 0%>">
<%= image_tag image.photo.url(:thumb), class: 'img-responsive' %>
</a></li>
<% end%>
And if anyone is searching for a solution for .carousel-inner div (pretty much the same):
<div class="carousel-inner">
<% #gallery.images.each_with_index do |image, index| %>
<div class="item <%= 'active' if index == 0%>" data-slide-number="<%= index %>">
<%= image_tag image.photo.url(:large), class: 'img-responsive' %>
</div>
<% end%>
</div>
Something like this should work:
<% #gallery.images.each_with_index do |image, index| %>
<li> <a id="carousel-selector-<%=index%>" class="<%='selected' if index == 0%>">
<%= image_tag image.photo.url(:thumb), class: 'img-responsive' %>
</a></li>
<% end%>
Revised: because I didn't notice the selected difference in the li tag. Now I'm using each_with_index

How can I declare a data-attribute using ERB?

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.

Resources