Question

I got a .NET MVC3 project which was just deployed to an actual server inside a virtual directory. Let’s call it VirtDir. My JavaScript files all had URLs for AJAX defined like this:

"/Home/Save/"

which was working fine locally.

On the actual server, that first “/” kills the virtual directory, so I get

"/Home/Save/" instead of "/VirtDir/Home/Save/" which obviously fails.

If I remove the first “/”, then things break locally, resulting in defined URL being appended to the URL of the current page: If you’re on "/Home/Index" page, the AJAX URL would point to

"/Home/Index/Home/Save".

My JavaScript is in separate *.js files, so I can’t really write @Url.Content to them.

Anyone knows of a good solution for this problem?

Answer 1

You can add some code to your layout file or master page that writes out the root directory to a JS variable before including the JS file. Then you can use that variable to build the path in your JS file.

In Razor:

<script type="text/javascript">
    var rootDir = "@Url.Content("~/")";
</script>
<script src="@Url.Content("~/Scripts/MyScript.js")" type="text/javascript"></script>

Then you can just build your url in your file like this:

var myurl = rootDir + "Home/Save/";