Javascript in Virtual Directory unaware of Virtual Directory

Say I have the site http://localhost/virtual where virtual is the开发者_开发百科 virtual directory

I have an Ajax request that is defined in a javascript file using JQuery

$.getJSON("/Controller/Action")

When this is called, the client tries to find the url at the root level i.e. http://localhost/Controller/Action

If I add the tilde (~) symbol in, it turns into http://localhost/virtual/~/Controller/Action

It should (if it was to do what I wanted) resolve to http://localhost/virtual/Controller/Action

Any ideas on how to fix this?

Aku's hint above looked right but it didn't want to work for me. Finally I figured out to use it like this

<script type="text/javascript">
    var config = {
        contextPath: '<%= @Url.Content("~")  %>'
    };
</script>

and then in my JavaScript I use it like this

config.contextPath + 'myAppPath".

So in case of no virtual directory this resolves to "/" + "myAppPath" and in case of a virtual directory this resolves to "/VirtualPath/" + + "myAppPath"

and this finally worked for me.

I used this solution successfully

Place the following element in your masterpage

<%= Html.Hidden("HiddenCurrentUrl", Url.Action("Dummy"))%>

Declare a global variable in your main javascript file

var baseUrl = "";

Set baseUrl to the value of "HiddenCurrentUrl" when your javascript is loaded

baseUrl = $("#HiddenCurrentUrl").val();
baseUrl = baseUrl.substring(0, baseUrl.indexOf("Dummy"));

Use baseUrl

$.getJSON(baseUrl + "Action")

EDIT Improved solution

In your controller

ViewBag.BaseUrl = Request.Url.GetLeftPart(UriPartial.Authority) + Request.ApplicationPath + "/";

In your master page

<script type="text/javascript">
    var YourNameSpace = YourNameSpace || {};
    YourNameSpace.config = {
        baseUrl: "@ViewBag.BaseUrl"
    }
</script> 

Use your baseUrl

$.getJSON(YourNameSpace.config.baseUrl + "Action")

Another way to get a base url is

<script type="text/javascript">
  window.g_baseUrl = '@Url.Content("~")';
</script>

For example, if you run your app from SomeName virtual directory then window.g_baseUrl variable will be equal to /SomeName/

Benefit of this method is an ability to call actions in the other controllers like so

$.getJSON(window.g_baseUrl + "AnotherController/Action") 

Maybe,$.getJSON("Controller/Action") will do?

The tilde shortcut for your application root path is a special feature of ASP.NET, not part of URLs themselves. Consequently trying to use a URL with a tilde in from JavaScript won't resolve the site root, it'll just give you a literal ~ as you can see.

You'd need to pass the value of the application root path to JavaScript so it can construct URLs itself. I'm not that familiar with ASP.NET but I believe you could do something like:

<script type="text/javscript">
    var approot= <%= JavaScriptSerializer.Serialize(Request.ApplicationPath) %>;
    ... $.getJSON(approot+'/Controller/Action') ...;
</script>

A simpler way to do it if you know there's a link on the page to the approot would be to read the href of that link:

var approot= $('#homepagelink').attr('href');

Relative Path to the JS file was the only solution I found $.getJSON("../Controller/Action")

I know this question is very old but I was lately struggling with this issue and was able to resolve it using

  url:'<%=VirtualPathUtility.ToAbsolute("~/Include/cntrols/Data.aspx") %>',

this works great in my ajax call...

It is too late to answer this question. But may be useful to someone as I had same problem. Instead of doing all this steps mentioned in above answers, better way is to use

Url.Action('action','controller').

It'll generate url /VIRDIR/controller/action if it is running from virtual directory or generate /controller/action in other case.