Skip to content Skip to sidebar Skip to footer
Home / Asp.net Mvc / Javascript / Jquery

What Is The Picture Folder To Use In Javascript

Post a Comment
In my View I can drag and drop from my Content folder and get picture address automatic.

Solution 1:

Can't seem to find a quick reference, but ~ can be used on <img src='~/... and in @Url.Content("~. It won't work in a js literal.

If your js is in a razor .cshtml, you can do:

$('#tabs').block({
    message: '<h1><img src=' 
                   + '"'
                   + '@Url.Content("~/GTracker/Content/busy.gif")' 
                   + '"'
                   + ' /> Just a moment...</h1>',
    css: { border: '2px solid #3399ff' }
});

or

$('#tabs').block({
    message: '<h1><img src="@Url.Content("~/GTracker/Content/busy.gif")" /> Just a moment...</h1>',
    css: { border: '2px solid #3399ff' }
});

If, instead, this code is in a .js file, you'll need to pass in the translated root path, I normally do this with something like, in _layout.cshtml:

<head><script>var rootpath = '@Url.Content("~")';</script>

then you can use rootpath in your .js (assuming it's included after the above)

$('#tabs').block({
    message: '<h1><img src=' 
                   + '"'
                   + rootpath + '/Content/busy.gif' 
                   + '"'
                   + ' /> Just a moment...</h1>',
    css: { border: '2px solid #3399ff' }
});

The aleviates hardcoded paths and allows your website to move around as required.

Post a Comment for "What Is The Picture Folder To Use In Javascript"