Looping over an element in Rails 4 that encloses other elements with loops

Question

I am running issues using a link_to through a loop when there is another element encompassing the looped attributes.

Here's what I mean. I am showing posts for a blog in an image - this image will contain multiple elements of content, all of which are being pulled from my table in Rails.

With a stub as the link, this works fine, and it contains all of the image/post content within an <a> link:

<ul id="hexGrid">
  <li class="hex">
    <a class="hexIn" href="#">
      <img alt="rss feed" src="http://www.example/image.png" />
      <h1>Business Business Business </h1>
      <p>Ipsum Incorporated is going to do something</p>
    </a>
  </li>
</ul>

That said, I want it to attach the associated link from my Stub column in my Post table, so I will adjust the code like so:

<ul id="hexGrid">
  <li class="hex">
    <%= link_to post.slug, about_path(post.slug), class: "hexIn" %>
      <img alt="rss feed" src="http://www.example/image.png" />
      <h1>Business Business Business </h1>
      <p>Ipsum Incorporated is going to do something</p>
    </a>
  </li>
</ul>

Now I thought this looked great. I am still changing the link to be the hexIn class. However, the image posts end up being distorted and clearly wrong.

After looking at the source code, I noticed that Rails is successfully changing href to the link from the table (good!) but attaching a closing ` after the link. Since in the original code, this link remains open until line 7, I believe that's causing the issue.

<a class="hexIn" href="/about"></a>

Is there any way I can prevent the dynamic addition of that </a> in line 3 to fix this? Or another method?

take a look at this http://stackoverflow.com/questions/1086360/how-do-i-wrap-link-to-around-some-html-ruby-code link — power, Jul 20 '16 at 07:28

Abid Iqbal · Accepted Answer · 2016-07-20T09:29:14.307

1

Try this one.

<%= link_to about_path(post.slug), class: "hexIn" do %>
      <img alt="rss feed" src="http://www.example/image.png" />
      <h1>Business Business Business </h1>
      <p>Ipsum Incorporated is going to do something</p>
<%end%>

edited Jul 20 '16 at 09:29

answered Jul 20 '16 at 07:24

Abid Iqbal

753
8
22

1

Please check the indentation it's not looking perfect. – Ali Hassan Mirza Jul 20 '16 at 07:35
Giving it a shot now. I am seeing an error for 'undefined method stringify keys` which seems related to this answer: http://stackoverflow.com/questions/14986559/rails-undefined-method-stringify-keys. Testing it out now. Seems like you can't have other things going on (like the h1 and p) in the block. Trying to troubleshoot. – darkginger Jul 20 '16 at 07:35
do block will do the job for you as you required. – Abid Iqbal Jul 20 '16 at 07:38
Hey, figured it out. It's the `link_to` - the params should be passed in the first chunk like this: `<%= link_to about_path(post.slug), class: "hexIn" do %>`. If you update your answer, I'll upvote as it works. – darkginger Jul 20 '16 at 07:39

Looping over an element in Rails 4 that encloses other elements with loops

1 Answers1