Change image_tag file-name with Javascript dynamically

Question

I always end up writing sth like this in my code:

function setSomeImage(image_name) {
$("#some_div").html("<%= image_tag ('image.png') %>");
}

I am setting images based on a variable that I pass and I have to use the image_tag helper to write it properly in rails. However, Javascript and the image_tag don't work together very well.

What I want to do is, I want to manipulate the image_tag filename dynamically with javascript.

I can now write sth like this:

function setSomeImage(image_name) {
$("#some_div").html('<img src="/assets/'+image_name+'.png">');
}

but that is not clean. I want to use the image_tag helper, sth like this:

function setSomeImage(image_name) {
$("#some_div").html('<%= image_tag ('+image_name+') %>');
}

but that's not working. Any idea how I could combine both? Is there any best practice doing this?

Another idea is to pass the image_path directly as a variable to the function but that is not always possible.

Mandeep · Accepted Answer · 2015-06-26 07:43:13Z

3

If your js file has extension of js.erb, you'll be able to use asset_path helper to display some asset but you won't be able to pass a js variable to it because first ruby part will be evaluated and during that time image_name, a js variable won't be present.

edited Jun 26, 2015 at 7:43

answered Jun 26, 2015 at 6:45

Mandeep

9,1832 gold badges28 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sean McCleary · Accepted Answer · 2015-06-26 06:54:03Z

0

image_tag is rendered by the rails application on the server so it is not possible to use it in JavaScript. The second code block that you thought was not clean is likely as good as you're going to get if you are trying to do this with JavaScript.

answered Jun 26, 2015 at 6:54

Sean McCleary

3,8204 gold badges35 silver badges44 bronze badges

10 Comments

Mandeep Over a year ago

so you mean image_tag and other helpers used in a view are on the server? :)

Sean McCleary Over a year ago

That's what I'm saying :)

Mandeep Over a year ago

and js is not present on the server? It gets injected by browser?

Mandeep Over a year ago

checkout guides.rubyonrails.org/…

Sean McCleary Over a year ago

Think of JS as completely different than what rails is doing. JS is only rendered in the browser. The ERB <%= image_tag ('+image_name+') %> is only something that rails is going to render in the HTML. The HTML that rails renders can be later manipulated by JavaScript, but you can not use rails view helpers in JavaScript.

|

Collectives™ on Stack Overflow

Change image_tag file-name with Javascript dynamically

2 Answers 2

Comments

10 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

10 Comments

Your Answer

Sign up or log in

Post as a guest

Related