Search code examples
jsfjsf-2.2omnifaces

JSF 2.2: output "jsf.js" and "omnifaces.js" manually to body instead of head


i have a problem with the load-order of javascript-resources in my jsf-project. in my master-template i load all scripts at the bottom of the page:

<h:body>

    ...

    <ui:insert name="scripts">          
        <h:outputScript name="js/jquery.js" />
        <h:outputScript name="js/chart.js" />
        <h:outputScript name="js/all.js"  />
    </ui:insert>
</h:body>

on some pages i use the omnifaces commandscript-tag with a javascript-function defined in all.js:

 <o:commandScript name="ALL.selectTypes" action="#{bean.typeSelected}">

i get

ReferenceError: ALL is not defined

the reason is, that at the time jsf.js and omnifaces.js are loaded, all.js isn't loaded yet, because both scripts appear in the head of the document while my own scripts appear at the bottom. when i put my scripts in

<h:head>

instead at the page bottom it works as expected. can i control manually the appearance for these scripts so that they appear like:

<h:body>

    ...

    <ui:insert name="scripts">      

        <h:outputScript library="javax.faces" name="jsf.js"  />
        <h:outputScript library="omnifaces" name="omnifaces.js"  />

        <h:outputScript name="js/jquery.js" />
        <h:outputScript name="js/chart.js" />
        <h:outputScript name="js/all.js"  />
    </ui:insert>
</h:body>

the above try doesn't have any effect. jsf.js and omnifaces.js are placed in the head anyway. i also tried with replacing

 <h:outputScript> 

with

 <o:deferredScript>

but can't made it. are there any alternatives? thanks in advance for hints.


Solution

  • You'd better declare ALL namespace in head or perhaps in a general script loaded in head.

    <h:head>
        ...
        <script>var ALL = {};</script>
    </h:head>
    

    And make sure that all.js itself doesn't override this by another var ALL = {}.

    var ALL = ALL || {};