Javascript files not mapping correctly in ASP.NET MVC?

Question

I am having an issue with my javascript files in a master page ... I have the following:

<script src="Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>

<script src="Scripts/Plugins/jquery-corners.js" type="text/javascript"></script>

This works ... until I start to go deeper into the routes ... for example, http://localhost/mywebsite works, but http://localhost/mywebsite/action does not work - I lose all my javascript imports.

I have use Url.Content for my images ... but it doesn't look like I can do anything for my javascript. It can't be that difficult ... I must be missing something! Any help would be appreciated!

Update

I found the following http://stackoverflow.com/questions/347528/using-scripts-in-a-master-page-with-asp-net-mvc ... but I can't get this to work if I put it between the tags ... where I need it. If I do try putting it there I get the following error:

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

Answer 1

Try an absolute path for the script src:

<script src="/Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>

(or /mywebsite/Scripts/..., depending on where the scripts are relative to the root).

Answer 2

Check out UrlHelper.Content (can't find MSDN docs, sorry)

Answer 3

Figured it out with the help of other posts here on stackoverflow. Here is what finally worked:

<script src="<%= Url.Content("~/Scripts/CreativeLogic.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/jquery-1.2.6.min.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/Plugins/jquery-corners.js") %>" type="text/javascript"></script>

<script type="text/javascript"> 
    $(document).ready(function()
    {
        $('.part').corner("15px");
    });
</script>