Weird issue with script AtHead/Foot()

Topics: General, Troubleshooting, Writing modules, Writing themes
Jan 8, 2012 at 10:07 PM
Edited Jan 9, 2012 at 2:49 AM

In my theme's Layout.cshtml:

    /* Global includes for the theme
    ***************************************************************/
    Script.Require("ShapesBase").AtHead();
    Script.Require("jQuery").AtHead();
    //Script.Require("MyModule_Profiles").AtHead();

I get the js includes at the bottom of the html: 

<script src="/Media/Default/Combinator/Scripts/-271868083-1.js" type="text/javascript"></script>

I'm trying to get jquery included in the <head>, but the only way I can do that is if i include a resource from my module, like so in Layout.cshtml:


    /* Global includes for the theme
    ***************************************************************/
    Script.Require("ShapesBase").AtHead();
    Script.Require("jQuery").AtHead();
    Script.Require("MyModule_Profiles").AtHead();

In which case I get the combined .js include in the <head> tag. Am I using this wrong, or is this an issue with Combinator or Orchard? 

Coordinator
Jan 9, 2012 at 1:33 AM

The thing with scripts is that they are shared resources, so if another piece of code includes the same scripts after you, and does it at the foot, then it's going to win. In particular, the manifest-version of jQuery is probably winning over you, so unless you modify that manifest...

Jan 9, 2012 at 3:00 AM

I'm not sure I understand what you mean by "manifest-version of jQuery". I'm including the one from Orchard.jQuery's ResourceManifest.cs by referencing "jQuery", is that what you mean? 

Even if so, I don't understand why the includes appear in the <head> all of a sudden, once I include something from my modules. I created an empty .js file in my module called empty.js, and declared it in my ResourceManifest.cs as "ge-empty". It has no dependencies set. By including that one after "jQuery", I can force the Combinator's bundled js to show up in the <head> instead of at the bottom of the html. 

I didn't think anything was including jQuery after my own call to it in the Layout.cshtml, because calling Script.Require("ge-empty").AtHead() right after Require()'ing jQuery puts the reference in the head tag. Nothing else changes so if something were referencing jQuery to the Foot after my Layout.cshtml, it should still be doing so in the 2nd scenario. But I could me mistaken, if by "after" you mean something related to how the ResourceManifests are oraganized, as opposed to when the Script.Require() calls are chronologically executed.