Come aggiungere diversi javascript in una pagina quando si utilizza ui:composizione

Sto usando una pagina con ui:composizione utilizzare su di esso come questo

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.prime.com.tr/ui" 
    xmlns:f="http://java.sun.com/jsf/core">

    <h:head>

        <title></title>

    </h:head>

    <h:body>

        <ui:composition template="./WEB-INF/templates/layout.xhtml">

            <ui:define name="title">#{faqAddUpdate.actionState} FAQ</ui:define>
            <ui:define name="content">

                <h:form id="faqAddUpdateForm" style="border-color: #000000;width: 960px;position: absolute;left: 150px;" prependId="false">
                ....
                ....

                </h:form>

            </ui:define>

        </ui:composition>

    </h:body>
</html>

Mio layout.xhtml questo aspetto

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    <h:head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <script type="textext/javascript" src="ckeditor/ckeditor.js" >
            <ui:insert name="script"></ui:insert>
        </script>

        <title>
            <ui:insert name="title">Login</ui:insert> 
        </title>

    </h:head>
    <h:body>
        <div id="top">
            <ui:insert name="top">
                <ui:include src="header.xhtml" id="header"/>
            </ui:insert>
        </div>
        <div>
            <div id="content">
                <ui:insert name="content"></ui:insert>
            </div>
        </div>
        <div id="bottom" style="position: absolute;top: 675px;width: 100%" align="center">
            <ui:insert name="bottom">
                <ui:include src="footer.xhtml" id="footer"/>
            </ui:insert>
        </div>
    </h:body>
</html>

sulla mia pagina sto usando qualcosa di simile a questo

<h:body>

    <ui:composition template="./WEB-INF/templates/layout.xhtml">
        <ui:define name="script"></ui:define>
        <ui:define name="title">#{faqAddUpdate.actionState} FAQ</ui:define>
        <ui:define name="content">
        ....
       </ui:define>

   </ui:composition>

Questo aggiungi tag javascript nella pagina della sezione head.Ora voglio chiedere se voglio aggiungere altro .js file sulla mia pagina. Il necessario definire un’altra interfaccia utente:inserire il nome=”script” nel mio layout.pagina xhtml come questo?

<script type="textext/javascript" src="js/1.js" >
        <ui:insert name="script"></ui:insert>
</script>

<script type="textext/javascript" src="js/2.js" >
        <ui:insert name="script"></ui:insert>
</script>

e così via. O c’è qualche trucco che definire i tag script nel mio layout.xhtml una volta e quindi sulla base dell’attributo src, la inserisco sul mio ui:composizione pagina?

Grazie

OriginaleL’autore Basit | 2012-01-25

2 Replies
  1. 14

    Non è necessario farlo utilizzando l’interfaccia utente:inserti. Ovunque vi sia necessità di aggiungere un file javascript in pagine. Basta aggiungere come questo uso della risorsa API.

    <h:outputScript library="javascript" name="1.js" target="head" />

    Per questo creare una cartella WebContent/risorse/javascript e mettere 1.js javascript cartella.

    ya, ma sto utilizzando l’interfaccia utente:composizione. E se io uso questa linea nella mia pagina del tag di intestazione, quindi ui:composizione eliminare tutti i tag al di fuori di essa. Questo non funziona in caso di ui:composizione. Io l’ho fatto. Dovrò usare qualcosa di simile a questo nella mia pagina di layout <ui:insert name="script"></ui:insert> e poi nella mia pagina all’interno di ui:composizione, mi si dispone di utilizzare questo <ui:define name="script"><h:outputScript library="Javascripts" name="jquery-1.7.1.js"/> </ui:define> <ui:define name="script"><h:outputScript library="Javascripts" name="1.js"/> </ui:define>. Questo è giusto.
    Basta mettere che <h:outputScript target="head"> linea all’interno <ui:define name="content">.
    Grazie amico, il tuo commento di cui sopra appena salvato il mio pomeriggio.

    OriginaleL’autore Ravi

  2. 1
    <h:head>
    
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
        <title>
            <ui:insert name="title">Login</ui:insert> 
        </title>
    
        <ui:insert name="script"></ui:insert>
    
    </h:head>
    
    <h:body>
        <div id="top">
            <ui:insert name="top">
                <ui:include src="header.xhtml" id="header"/>
            </ui:insert>
        </div>
        <div>
            <div id="content">
                <ui:insert name="content"></ui:insert>
            </div>
        </div>
        <div id="bottom" style="position: absolute;top: 675px;width: 100%" align="center">
            <ui:insert name="bottom">
                <ui:include src="footer.xhtml" id="footer"/>
            </ui:insert>
        </div>
    </h:body>

    e poi nella tua pagina di usare qualcosa di simile a questo

    <h:body>
        <ui:composition template="./WEB-INF/templates/Review_Template.xhtml">
    
            <ui:define name="title">FAQ Review</ui:define>
    
            <ui:define name="script"><h:outputScript library="Javascripts" name="jquery-1.7.1.js"/> </ui:define>
            <ui:define name="script"><h:outputScript library="Javascripts" name="1.js"/> </ui:define>
            <ui:define name="content">
                <h:form id="FaqGridForm" prependId="false" >
                    ....
                </h:form>
    
            </ui:define>
        </ui:composition>
    </h:body>

    E Javascript cartella dovrebbe essere dentro, cartella di risorse, come detto da Ravi nella sua risposta 🙂

    Grazie

    OriginaleL’autore Basit

Lascia un commento