How do you link to .js files located in the View folders from a page using Asp.net MVC

Question

For example, if I have a page located in Views / Home / Index.aspx and a JavaScript file located in Views / Home / Index.js, how do you link to this aspx page?

The example below does not work, although the compiler says the path is correct

<script src="Index.js" type="text/javascript"></script> 

The exact same problem has been published here in more detail: http://forums.asp.net/p/1319380/2619991.aspx

If this is not possible, will it be in the future? If not, how does everyone manage their javascript resources for large Asp.net MVC projects? Are you just creating a folder structure in the Content folder that reflects the View folder structure? YUCK!

Answer 1

For shared JavaScript resources using the Content folder, it makes sense. The problem was that I specifically tried to decide if there was JavaScript with javascript that would never be reused.

I think that I just need to do javascript on an aspx page right on the page itself and save js shares in the "Content" folder.

Answer 2

You can use the VirtualPathUtility.ToAbsolute method, as shown below, to convert the relative .js application URL to an absolute URL that can be written to the page:

 <script type="text/javascript" src="<%=VirtualPathUtility.ToAbsolute("~/Views/Home/Index.js") %>"></script> 

Answer 3

You must have a separate folder structure for scripts. For example, the JavaScript folder at the root of the application. Storing js files with views affects not only path resolution issues, but also affects the level of security and permissions. In addition, it is much easier to embed JS files as assembly resources if you decide to deploy part of your application parts separately in the future when they are saved in a dedicated subfolder.

Answer 4

Here's a nice extension method for HtmlHelper:

 public static class JavaScriptExtensions { public static string JavaScript(this HtmlHelper html, string source) { TagBuilder tagBuilder = new TagBuilder("script"); tagBuilder.Attributes.Add("type", "text/javascript"); tagBuilder.Attributes.Add("src", VirtualPathUtility.ToAbsolute(source)); return tagBuilder.ToString(TagRenderMode.Normal); } } 

Use it as follows:

 <%=Html.JavaScript("~/Content/MicrosoftAjax.js")%> 

Answer 5

If you redirect your pages to a custom RouteHandler, you can check for files before accessing RequestContext in the MvcHandler class.

Example (not complete):

 public class RouteHandler : IRouteHandler { public IHttpHandler GetHttpHandler(RequestContext requestContext) { var request = requestContext.HttpContext.Request; // Here you should probably make the 'Views' directory appear in the correct place. var path = request.MapPath(request.Path); if(File.Exists(path)) { // This is internal, you probably should make your own version. return new StaticFileHandler(requestContext); } else { return new MvcHandler(requestContext); } } }