miller the gorilla miller the gorilla - 2 months ago 8
Ruby Question

unable to successfully interpolate strings in Ruby

I'm a noob to rails but am trying to create a partial that is passed a collection.

There is a variable counter that is defined inside the partial that is implicit to the collection that is passed in called _counter which I am referencing to update the row names for the benefit of the css selectors. the code looks like this:

<div class=<%= "column1--row" + product_counter.to_s + " column1--row" %> >
<img src=<%= "http://fillmurray.com/" + (size + product_counter).to_s + "/" + (size + product_counter).to_s %> alt="product1" class="product-image">
<div class="description">
<span class="title"><%= product.title %></span><br>
<span class="details"><%= product.description %></span>
<span class="rank">
<i class="fa fa-caret-up" aria-hidden="true">936</i>
</span>
<span class="comments"><i class="fa fa-comment" aria-hidden="true">45</i>
</span>
</div>




but the html for the top div ends up looking like this:

<div class="column1--row0" column1--row="">
<img src="http://fillmurray.com/155/155" alt="product1" class="product-image">
<div class="description">
....


So the div class ends up with the wrong selector. I've tried a bunch of different interpolations and the result is often the same:

this :

<div class=<%"column1--row#{product_counter.to_s} column1--row"


and a few others including the concat method of the string class. I'm guessing there's something obvious that I'm missing as I'm not getting any problems with concatenating the strings in the img src tag.

Thanks in advance.

dkp dkp
Answer

Try this:

<div class=" <%= 'column1--row' + product_counter.to_s + ' column1--row' %> " >
  <img src= " <%= 'http://fillmurray.com/' + (size + product_counter).to_s + '/' + (size + product_counter).to_s %> " alt="product1" class="product-image">
  <div class="description">
    <span class="title"><%= product.title %></span><br>
    <span class="details"><%= product.description %></span>
    <span class="rank">
     <i class="fa fa-caret-up" aria-hidden="true">936</i>
    </span>
    <span class="comments"><i class="fa fa-comment" aria-hidden="true">45</i>
    </span>
</div>
Comments