Question

In visual studio virtual server this works. But when I put site on IIS it doesn’t display images from content folder.

    var imgPath = '/Content/Images/Icons/' + icon + '.png';
                var imageContent = '@Server.MapPath(Url.Content("-1"))';
                image = imageContent.replace('-1', imgPath);

I get errors in browser foreach image

http://localhost/Content/Images/Icons/carwash.png Failed to load resource: the server responded with a status of 404 (Not Found)

Answer 1

First thing is first, are you sure that all of your ‘icons’ are part of the solution and are actually being deployed to your web server? I have had a few instances where I would add a file to the solution directory and VS does not automatically include in it the solution, thus it never actually gets deployed…

If that is ok and the images are actually there, my next question would be, have you tried just using the @Url.Content helper in your view to determine if that is working as it should?

<img src="@Url.Content("~/Content/Images/Icons/SomeIcon.png")"/>

EDIT

Since you are trying to accomplish this in Javascript and the above tag works in HTML, you should be able to condense that code up there to the following code:

var image = '@Url.Content("~/Content/Images/Icons/")' + icon + '.png';

Go ahead and let MVC get the path to the Icon folder and append your file and extension to that. This should eliminate the need for string replacement and still be able to process the icon paths in JS.

var image will now be the complete relative path to the icon file you have passed to this function. You can use this string to update and img src tag or create an image or whatever.