JQuery ajax .load() to reference to the correct url

Question

I have a localhost with a few projects, so this project in VS2010 properties->web->use local IIS web server = 'localhost/project4/'. (I can't use the normal debug VS Development Server as some components won't work in my project) Anyhow, localhost is fine no big deal, so I go on coding.

Now, in ajax when I call .load('/Account/LogOn'); it gives me 'localhost/Account/LogOn' but what I really want is 'localhost/project4/Account/LogOn' because it is sitting in the project4 directory, not the root.

Any idea how to tell ajax I need that virtual directory prefix between domain name and the rest of the url?

EDIT --------------------------------------------

Thanks guys, combined with all your knowledge, I guess the best ways to do it are:

1. Include the js script into .cshtml server side and use "~/Account/LogOn/" let .net figure out the path.

2. Make a global var remove_me_debug_only_virtual_directory = "/project4/"; in js code. append it to the domain name. this way we don't have to pull .net into the water and write js code in .cshtml.

3. Move the project to localhost/ root if you can, in this case I can't, because other people at work wants to access this networked server and do demo.

Answer 1

If your JS code is in an MVC cshtml file, use it like this:

.load('@Url.Action("LogOn", "Account")');

The proper URL will be placed in the concrete JS code.

Answer 2

According to .net documents,

Absolute and relative path references in a server control have the following disadvantages:

Absolute paths are not portable between applications. If you move the application that the absolute path points to, the links will break.

Relative paths in the style of client elements can be difficult to maintain if you move resources or pages to different folders.

To overcome these disadvantages, ASP.NET includes the Web application root operator (~), which you can use when specifying a path in server controls. ASP.NET resolves the ~ operator to the root of the current application. You can use the ~ operator in conjunction with folders to specify a path that is based on the current root.

So as described above, using ~ will lead you to the root of your web project using asp:

 <asp:image runat="server" id="Image1" ImageUrl="~/Images/SampleImage.jpg" />

For more information go to: Web Project Paths

Based on your update: Possible duplicate of: base url using jQuery

Where stated by @gregguida:

  var l = window.location;
  var base_url = l.protocol + "//" + l.host + "/" + l.pathname.split('/')[1];

  //all you need to do is work with l.pathname.split('/') to find what you need.

Answer 3

I am a java developer but the context is same in both case, In your can follow the steps

1. Check the context of your server if root is "/" then you have to call something like,

   .load('/project4/Account/LogOn');

2. If your application is root and you can calling this request from itself then

   .load('Account/LogOn');