Ajax requests ignore virtual application sub-folder name in URL for ASP.NET MVC application

Question

My application is located on the server under a separate virtual directory. To access my ASP.NET MVC application users have to go to:

http://server-dev/superApp

I have a problem with Ajax/Json server requests ignoring the "superApp" directory part. Whenever an Ajax request is made Fiddler shows 404 because instead of http://server-dev/superApp/User/GetUsersJson for example, http://server-dev/User/GetUsersJson is called (note the missing superApp name).

Example of an Ajax request:

function GetUsers(id) {
    $.ajax({
        url: "/User/GetUsersJson/",
        data:{ id: id},
        datatype: 'json',
        type:'post',
        success: function (result) {
            ////Do stuff with returned result
        }        
    });      
}

Registered route:

r.Match("User/GetUsersJson", "User", "GetUsersJson");

Where should I look and what can I change to make sure that my application virtual folder is ALWAYS included in all URL requests ?

p.s. Please note that all Javascript/Ajax logic is kept in separate .js files so no RAZOR syntax is available.

Answer 1

Did you try using the HTML helper method ?

url: "@Url.ACtion("GetUsersJson","User)"

EDIT : As per the comment

You may get the Path name using the HTML Helper method and Keep that in a Global variable and access that in the external javascript file

In the view

<script type="text/javascript>
  var globalGetJSONPath='@Url.ACtion("GetUsersJson","User)';
</script>

And now you can use it in the external file like this

 $.ajax({
        url: globalGetJSONPath,
        data:{ id: id},
        //remaining items....

  });