Question

My layouts are placed inside layout/scripts/layout.phtml
i have placed the below code inside my head section of layout.phtml

<?php
print $this->headScript()->appendFile($this->baseUrl().'/js/jquery-1.7.2.min.js')
                         ->appendFile($this->baseUrl().'/js/simpla.jquery.configuration.js');
?>

Now I want to append another javascript file from a view. For that I wrote the following code:

 $this->headScript()->appendFile($this->baseUrl().'js/fancybox/jquery.fancybox-1.3.4.pack.js');

Although this appended the file but it appears before my jquery-1.7.2.min.js. What i want is that i want to add jquery.fancybox-1.3.4.pack.js below my jquery-1.7.2.min.js
How can i do this?

Answer 1

Your view script is rendered before the layout so the calls to appendFile() in your layout result in those scripts (jquery-1.7.2 and simpla.jquery) being appended after the one you appended in the view script.

To fix this, use prependFile() in your layout at least for the main jQuery script.

Your layout might look like this:

<?php
print $this->headScript()
           ->appendFile($this->baseUrl().'/js/simpla.jquery.configuration.js')
           ->prependFile($this->baseUrl().'/js/jquery-1.7.2.min.js');

No need to change the view script, that is fine as is.

See HeadScript Helper Example #23 which talks a bit about ordering of the scripts.

The important thing to remember that they don’t mention is that your view script gets rendered before the layout does.