Login/Register
ASP.Net Master Page and File path issues
Asked Answered
Solved asp.netjavascriptjqueryrunatserver
P

10

80

I'm trying to add a script reference to jQuery in my master page so that it will work for any page. It currently looks like this

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

The problem is that the path is always relative to the executing aspx page so this will only work if the "jquery.js" file is located in the same folder. To make it work I have to change the line to:

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

This is obviously less than ideal because it will only work for pages that are two levels deep from the root folder. If I try the following, IIS throws an error about an unexpected character.

<script runat="server" type="text/javascript" src="~/jquery.js"></script>

Any ideas?

EDIT: I forgot to mention as well that the script MUST be in the head tag

The current top answer throws a "ASP.NET Ajax client-side framework failed to load." error when I add it to my master page. Its thrown from javascript and not the .Net compiler. If I move the ScriptManager to the head section where it should be I get a compile error about the ScriptManager needing to be inside a form tag.

The third answer throws a "Illegal characters in path." exception from the compiler

EDIT 2: When I add that line to my head tag I get this error from IIS.

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

SOLVED: I took the edited response from the answer below and put it inside an asp:ContentPlaceHolder element

Phyto answered 30/3, 2009 at 15:18 Comment(1)
The solution for this problem learn.microsoft.com/en-us/aspnet/web-forms/overview/… – Broadbill
M
111

You could use a ScriptManager:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <Scripts>
        <asp:ScriptReference Path="~/jquery.js" />
    </Scripts>
</asp:ScriptManager>

EDIT: If you absolutely need this in your <head> section, you could do something like:

<head>
    <script type="text/javascript" 
        src="<%= Page.ResolveClientUrl("~/jquery.js") %>"></script>
</head>

EDIT 2: According to the comments, if you are observing that

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

you may need to change the above to use the data-binding syntax:

<head>
    <script type="text/javascript" 
        src="<%# Page.ResolveClientUrl("~/jquery.js") %>"></script>
</head>
Midinette answered 30/3, 2009 at 15:22 Comment(7)
Aye, this is a highly recommended method in a lot of ASP.NET books I've written when dealing with paths in masterpages. – Lilian
FYI, my co-worker and I just tried this out. This doesn't seem to work in a nested master page scenario in the parent master page. Moving it to the child master page, however, did the trick. – Pyorrhea
This worked for me on nearly all of my pages, but for 2 pages that would blow up with a certain exception: "The controls collection cannot be modified because the control contains code". The solution is to change the script include in the header from a response.write codeblock to a databind evaluator (ie - change <%= to <%# ). I would hazard a guess that it's some type of attempt on MS's part to stop http header attacks. A better explanation of this easy fix can be found at: leedumond.com/blog/… – Egide
Using base href ? – Mariomariology
@Egide leedumond.com/blog/… not found – Mariomariology
ScriptReference not add script in head section ? – Odiliaodille
Use PlaceHolder #779452 – Odiliaodille
I
27

Try <%# instead of <%= in Master page under head section 

<script type="text/javascript" 
        src="<%# ResolveUrl("~/YourScriptFolder/YourJQueryOrJavascript.js") %>">
</script>

Then in Code Behind of Master page under Page_Load Event

Page.Header.DataBind();

Now you are good to go with either jQuery and JavaScript as well as CSS just you need to change your path in ResolveUrl which file you want to handle CSS, JavaScript, jQuery.

Indebtedness answered 16/11, 2012 at 10:14 Comment(2)
Needed the Page.Header.DataBind(); line for it to work for me, thanks! – Melson
You may also need to add the runat="server" attribute on the head tag. – Weaks
A
12

If you're not going to us asp:ScriptManager or absolute paths then you can do it like this:

<script runat="server" type="text/javascript" 
  src='<%= Page.ResolveUrl("~/jquery.js") %>'></script>
Aloise answered 30/3, 2009 at 15:26 Comment(0)
K
3

I do not know whether you guys found the solution to your problem or not. I was facing the same problem and going nuts to figure out why do I get "jQuery is undefined" error on the plugins i use. I tried all the solutions i get from the internet but no luck at all.

But, suddenly something splash on my mind that may be the script files should be in order. So, I moved the jquery referece to first position and everything start working like charm.

Remember guys, if you're using any plugins with jquery, make sure you use the folloing order of setting reference to those fiels.

  1. reference to the jquery library
  2. reference to the other subsequent plug-in libraries and so on...

e.g.:

  1. "script src="js/jquery-1.3.2.min.js" type="text/javascript"...
  2. "script src="js/jqDnR.min.js" type="text/javascript"...
  3. "script src="js/jquery.jqpopup.min.js" type="text/javascript"...
  4. "script src="js/jquery.bgiframe.min.js" type="text/javascript"...

Always make sure you must put the jquery reference to first and then the subsequent libraries.

Hope, this solves your problem especially when you use with MasterPages. Its very strange that it works no matter what order you use when you don't use MasterPages but when you do, then it somehow requres the proper order.

Good luck and happy coding,

Vincent D'Souza

Kirkendall answered 31/8, 2009 at 12:58 Comment(0)
J
3

Look at How to Run a Root “/”. This should fix all your issues regarding unresolved .js file paths. You basically reconfigure the VS Dev server to run your application as localhost:port/ as opposed to the regular localhost:port/application name/ making name resolution work the same way as it does on IIS.

Jenjena answered 11/8, 2011 at 7:23 Comment(0)
P
1

For absolute path of the file for any page use it following:

<script type="text/javascript" src="<%= Page.ResolveClientUrl("~/jquery.js") %>"></script>
Planetarium answered 11/11, 2013 at 5:44 Comment(0)
F
0
<script type="text/javascript" src="/full/path/to/jquery.js"></script>
Fingered answered 30/3, 2009 at 15:21 Comment(1)
Problem with paths off the root is that sometimes you may dev in a virtual dir and then deploy to the root of a site, or vice versa. – Calathus
E
0

If this script tag goes directly to the browser, then you unlikely can substitute your site's root there. At least not on the server. So you can:

  1. Deploy site to the root of domain name and use absolute paths (simplest solution).
  2. Insert this link with server control.
  3. Preprocess resulting HTML before sending it to the client (with HttpResponse.Filter).
Eyrir answered 30/3, 2009 at 15:24 Comment(0)
E
0

You can also use <base> HTML tag: 

<base href="http://www.domain.com"></base>

and then all the links in header section are relative to base address: 

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

It's often useful when you have multiple publishing destinations, like local dev web server, demo server, etc. You just replace that base URL.

Eyeball answered 30/3, 2009 at 15:40 Comment(1)
How-to change base href programmatically ? – Mariomariology
M
0
<body>
<script language="javascript" src='<%= this.ResolveClientUrl("~/full/path/to/jquery.js") %>' type="text/javascript"></script>
</body>
Mawkin answered 12/11, 2012 at 5:5 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.