Cómo incluir otro en XHTML XHTML usando JSF 2.0 Facelets?

¿Cuál es el camino más correcto para incluir otro XHTML de la página en una página XHTML? He estado tratando de diferentes maneras, ninguno de ellos están trabajando.

InformationsquelleAutor Ikthiander | 2011-01-25

2 Kommentare

  1. 418

    <ui:include>

    Forma más básica es <ui:incluir>. El contenido incluido debe ser colocado dentro de <ui:composition>.

    Kickoff ejemplo de la página principal /page.xhtml:

    <!DOCTYPE html>
    <html lang="en"
        xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
        <h:head>
            <title>Include demo</title>
        </h:head>
        <h:body>
            <h1>Master page</h1>
            <p>Master page blah blah lorem ipsum</p>
            <ui:include src="/WEB-INF/include.xhtml" />
        </h:body>
    </html>

    La página de incluir /WEB-INF/include.xhtml (sí, este es el archivo en su totalidad, todas las etiquetas que fuera <ui:composition> son innecesarios ya que son ignorados por Facelets de todos modos):

    <ui:composition 
        xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
        <h2>Include page</h2>
        <p>Include page blah blah lorem ipsum</p>
    </ui:composition>

    Este tiene que ser abierto por /page.xhtml. Tenga en cuenta que usted no tendrá que repetir <html>, <h:head> y <h:body> dentro del archivo de inclusión como que de otro modo resultaría en HTML no válido.

    Puede utilizar una dinámica de expresión EL en <ui:include src>. Véase también Cómo ajax-actualización dinámica de incluir contenido menú de navegación? (JSF SPA).


    <ui:define>/<ui:insert>

    Una forma más avanzada de entre los que se encuentra de plantillas. Esto incluye, básicamente, al revés. El maestro de la plantilla de la página debe utilizar <ui:insert> a declarar lugares para insertar plantilla definida por el contenido. La plantilla de página de cliente que está utilizando el maestro de la plantilla de la página debe utilizar <ui:define> para definir el contenido de la plantilla que se va a insertar.

    Maestro de la plantilla de la página /WEB-INF/template.xhtml (como un diseño de la pista: el encabezado, menú y pie de página a su vez puede ser incluso <ui:include> archivos):

    <!DOCTYPE html>
    <html lang="en"
        xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
        <h:head>
            <title><ui:insert name="title">Default title</ui:insert></title>
        </h:head>
        <h:body>
            <div id="header">Header</div>
            <div id="menu">Menu</div>
            <div id="content"><ui:insert name="content">Default content</ui:insert></div>
            <div id="footer">Footer</div>
        </h:body>
    </html>

    Plantilla de página de cliente /page.xhtml (nota de la template atributo; también aquí, este es el archivo en su totalidad):

    <ui:composition template="/WEB-INF/template.xhtml"
        xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    
        <ui:define name="title">
            New page title here
        </ui:define>
    
        <ui:define name="content">
            <h1>New content here</h1>
            <p>Blah blah</p>
        </ui:define>
    </ui:composition>

    Este tiene que ser abierto por /page.xhtml. Si no hay <ui:define>, entonces el contenido por defecto dentro de <ui:insert> se mostrará en su lugar, si los hubiere.


    <ui:param>

    Puede pasar parámetros a <ui:include> o <ui:composition template> por <ui:param>.

    <ui:include ...>
        <ui:param name="foo" value="#{bean.foo}" />
    </ui:include>
    <ui:composition template="...">
        <ui:param name="foo" value="#{bean.foo}" />
        ...
    </ui:composition >

    Dentro del include/archivo de plantilla, estará disponible como #{foo}. En caso de que usted necesita para pasar a «muchos» de los parámetros a <ui:include>, entonces es mejor que considere inscribirse en el archivo de inclusión como un tagfile, por lo que en última instancia puede utilizar como así <my:tagname foo="#{bean.foo}">. Véase también Cuando el uso de <ui:incluir>, archivos de etiquetas, compuesto de partes y/o componentes personalizados?

    Usted puede incluso pasar de frijoles enteros, los métodos y los parámetros a través de <ui:param>. Véase también JSF 2: cómo pasar de una acción, incluyendo un argumento que se invoca a un Facelets sub vista (con interfaz de usuario:incluyen la interfaz de usuario:param)?


    Diseño sugerencias

    Los archivos que no deben ser accesibles al público por el que acaba de entrar/adivinar su dirección URL, deben ser colocados en /WEB-INF carpeta como el archivo de inclusión y el archivo de plantilla en el ejemplo anterior. Véase también Que archivos XHTML necesito para poner en /WEB-INF y los que no?

    No tiene por qué ser cualquier tipo de código (el código HTML) fuera de <ui:composition> y <ui:define>. Usted puede poner cualquiera, pero será ignorado por Facelets. Poniendo marcado no sólo es útil para los diseñadores web. Véase también Es allí una manera de ejecutar una página JSF sin la construcción de todo el proyecto?

    El doctype de HTML5 recomendado es el doctype en estos días, «a pesar de» que es un archivo XHTML. Usted debe ver a XHTML como un lenguaje que permite generar código HTML de salida mediante un XML basado en la herramienta. Véase también Es posible el uso de JSF+Facelets con HTML 4/5? y JavaServer Faces 2.2 y soporte HTML5, ¿por qué es XHTML siendo utilizado.

    CSS/JS/archivos de imagen pueden ser incluidos como dinámicamente reubicable/localizada/versionado de los recursos. Véase también Cómo hacer referencia a CSS /JS /recurso de imagen en Facelets plantilla?

    Usted puede poner Facelets archivos en un reutilizables archivo JAR. Véase también La estructura de múltiples JSF proyectos con código compartido.

    De ejemplos del mundo real de avanzada Facelets de plantillas, consulte la src/main/webapp carpeta de Java EE de Inauguración de la Aplicación del código fuente y OmniFaces sitio escaparate de código fuente.

    • Hola Balus, respecto de: la forma Más básica es <ui:incluir>. El contenido incluido debe ser colocado dentro de <ui:composition>. Pienso que el contenido incluido puede ser simplemente en <p> </p> va a trabajar.
    • Sí, eso es correcto. interfaz de usuario:composición, sólo es necesario a) utilizar una plantilla (véase más arriba), o b) para envolver todo en <html><body> de modo que usted puede cargar el archivo con un explorador o un editor HTML.
    • Hola por favor puede resolver este acertijo para mí? He estado golpeando mi cabeza desde hace 3 días. stackoverflow.com/questions/24738079/…
    • Hola, BalusC. En caso de que usted todavía está aquí: ¿hay manera de incluir a otra página sin envolver con <ui:composition>? Sólo tienes que incluir es, literalmente, como el viejo estilo de cabeceras de C =)
    • no se si es realmente una composición.
    • Gran y precisa explicación, lo explica todo mediante la comparación de los 2 enfoques
    • Afaik si sólo declarar <ui:composition ...> dentro de facelet usted tiene que declarar el doctype como <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> también, de lo contrario se obtiene una entity referenced but not declared de error cuando se utiliza entidades HTML.
    • Después de 3 días de este método de plantilla no funciona en absoluto, sencillo incluir está bien, pero de plantillas es completo error. Viniendo de asp .net y este jsf es tan complicado solo para crear sencillos diseños de la vista.
    • Se incluye una interfaz de usuario:composición cosita independiente de todas las otras idénticas incluido thingies incluidos en el mismo objeto compuesto? Mi limitada comprensión de la composición dice que sí, pero tengo un Facelets la página que incluye el mismo Facelets de interfaz de usuario:composición fragmento de dos veces, cada una en una pestaña independiente. El fragmento de código que contiene una tabla de datos que tiene un contenido diferente en las dos pestañas. Tanto en rellenar tablas de datos normalmente cuando se representa primero pero cuando voy a cambiar de una ficha a otra anteriormente pobladas datatable está vacío y sólo una actualización de la página restaura. Estoy haciendo esta mal?

  2. 24

    Página:

    <!-- opening and closing tags of included page -->
    <ui:composition ...>
    </ui:composition>

    Incluyendo página:

    <!--the inclusion line in the including page with the content-->
    <ui:include src="yourFile.xhtml"/>
    • De iniciar su incluidos xhtml archivo con ui:composition como se muestra arriba.
    • De incluir ese archivo con ui:include en el que incluye xhtml archivo como también se muestra arriba.
    • A veces no es suficiente para identificar la ruta de acceso mientras que el uso de sólo un nombre de archivo. Para aquellos, que trató de la inclusión de archivos de arriba y no funcionó. Usted puede tratar de añadir una barra antes o nombre de archivo /directorio WEB-INF. Así que parece que <ui:include src="/yourFile.xhtml"/> o <ui:include src="/WEB-INF/yourFile.xhtml"/>

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Pruebas en línea