Which set of quotations marks do I use when mixing ruby with javascript?

Question

I am having trouble figuring out which set of quotation marks are appropriate to get the image below to load. The #icon + i part does work as I put in a sample image to append and the correct div is referenced. But I'm not able to figure out how to get the appropriate image to be loaded within src.

$(document).ready(function(){
  alert('test');
  <% if @iosapps %>
  for (var i =0; i < <%= @iosapps.length %>; i++) {
    $('#icon' + i).append('<img src = "<%= @iosapps['+i+'].app_store_icon %>">');
  }
  <% end %>
});

The error I currently get is: can't convert String into Integer

You're trying to mix JavaScript code with Ruby code: the `for` loop isn't executed until the code is on the client, the `<%= @iosapps...` is executed on the server side. Just loop in Ruby--there doesn't appear to be a reason to mix the two here. — Dave Newton, May 13 '13 at 20:29
possible duplicate of [Reference: Why does the PHP code in my Javascript not work?](http://stackoverflow.com/questions/13840429/reference-why-does-the-php-code-in-my-javascript-not-work) (just substitute PHP for Ruby) — deceze, May 13 '13 at 20:37

Sergio Tulentsev · Accepted Answer · 2013-05-13T20:38:38.087

0

You should loop in ruby, not in javascript. You can't freely mix these two. One is executed on the server, the other in client's browser. It's important to understand which does what.

This snippet should do what you want (more or less).

$(document).ready(function(){
  alert('test');
  <% if @iosapps %>
    <% @iosapps.each_with_index do |ia, idx| %>
      $('#icon<%= idx %>').append('<img src="<%= ia %>.app_store_icon ">');
    <% end %>
  <% end %>
});

Oh, and the error you're getting:

@iosapps['+i+']

You pass a string "+i+" as index of the array. Array doesn't know how to work with that, so it raises error.

edited May 13 '13 at 20:38

answered May 13 '13 at 20:33

Sergio Tulentsev

226,338
43
373
367

I get an error in the browser console saying: Resource interpreted as Image but transferred with MIME type text/html: "http://localhost:3000/#.app_store_icon.app_store_icon". – sharataka May 13 '13 at 20:38
Well, without your data I really can't say more. But, at least, now you're not getting that error :) – Sergio Tulentsev May 13 '13 at 20:39
Fair enough :). In the browser, the image getting passed is The actual url isn't get passed. – sharataka May 13 '13 at 20:41
Ah I fixed it. it was the %> in the wrong place. This helped a lot, thanks! – sharataka May 13 '13 at 20:42

Which set of quotations marks do I use when mixing ruby with javascript?

1 Answers1