jQuery not loading on Master Page when the Content Page is in a child folder

Question

I have a site where I am trying to implement a jQuery UI based MessageBox in my master page. Content pages are arranged accoring to business area folders, i.e. '~/Branding/Contracts.aspx'. I find that when I load such a content page, jQuery, which is referenced in the master page as below, does not load. I assume that this is because the browser is requesting 'Branding/Scripts/jQuery '. What can I do about this? I don't have the 'root' operator in a plain 'script' tag.

<script src="/Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>

Answer 1

Use this in your MasterPage

<script src="<%= ResolveUrl("~/Scripts/jquery-1.3.2.js") %>" type="text/javascript"></script>

Please let me know if you are facing any trouble further.

Answer 2

One option is to "Outsource" your call to jQuery to something like Googles AJAX libraries. This will give you the added advantage of your clients possibly alreading having a cached version of jQuery.

I use http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js

This wont help you if you have other custom scripts of course. For that I use the following on the page load event of the master page to load up my common sciprts.

        HtmlGenericControl myJs = new HtmlGenericControl(); 
        myJs.TagName = "script"; myJs.Attributes.Add("type", "text/javascript"); 
        myJs.Attributes.Add("language", "javascript"); //don't need it usually but for cross browser.
        myJs.Attributes.Add("src", ResolveUrl("~/scripts/jquery-ui-1.7.2.custom.min.js")); 
        this.Page.Header.Controls.Add(myJs);

Normally set up as a function with a paremter for the script path to make loading up multible js files easier.

Ode To Code has a fantatic article on Master Pages and this sort of thing:

http://odetocode.com/Articles/450.aspx