Symfony 2: How to generate image paths in javascript file?

Question

I've been googling this for long time! I need to show images on some menu hover and mouseout. The code is written in a js file. But the images path needs to be generated. Is there any way to generate image paths using something like this

{{ asset('bundles/mybundle/images/menu_down.png') }}

Can FOSJsRoutingBundle used to generate image paths in js files?

Answer 1

You could set global JS variables on your actual page:

<script>
    var menuDownUrl = "{{ asset('bundles/mybundle/images/menu_down.png') }}";
</script>

And then set inside your javascript file to call the global variable: window.menuDownUrl

Then creates a dependency inside your javascript file, but allows you to set that image dynamically.

Answer 2

You can put an input hidden and set the path of the image.

<input type="hidden" id="img_path" value="{{ asset('images/circle_loading.gif') }}">

After that in jQuery you can use it like this

var img  = "<img src=\'"+ $("#img_path").val() +"\'>";
$("div").html(img);