This question already has an answer here:
When using <ui:composition> templating, where should I declare the <f:metadata>?
(1 answer)
Closed 5 years ago.
In the following page i am not able to load automobileLists since the method to populate it is outside the component in a f:metadata. I have a nullPointerException error.
Partial code :
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>title</title>
</h:head>
<f:metadata>
<f:viewAction action="#{primeAutomobileController.populateAutomobileFieldList}"/>
</f:metadata>
<ui:composition template="layout/template.xhtml">
<ui:define name="content">.....................
The only way for me to load it is to scope the primeAutomobileController to session instead of the original request, and call the method from a preceding page through a button, i would like it to load at the starting of the page instead withouth calling it previously. The method in question :
public void populateAutomobileFieldList(){
List<String> automobileFieldSource = new ArrayList<>();
List<String> automobileFieldTarget = new ArrayList<>();
automobileFieldSource.add("Make");
automobileFieldSource.add("Model");
automobileFieldSource.add("Year");
automobileFieldSource.add("Description");
setAutomobileList(new DualListModel<>
(automobileFieldSource, automobileFieldTarget));
}
Partial index.xhtml page where f:metadata gets loaded
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>title</title>
</h:head>
<f:metadata>
<f:viewAction action="#{primeAutomobileController.loadAutomobiles}"/>
<f:viewAction action="#{primeAutomobileController.populateAutomobileFieldList}"/>
</f:metadata>
<ui:composition template="layout/template.xhtml">
<ui:define name="content"> ......................
Here both methods in f:metadata get properly loaded, like it's shown in an example in a video tutorial i'm following, but when it's the same exact code in a differe xhtml it doesn't work.
The documentation of metadata tag shows how it must be done when using templating (how the template must look like and how to use it in the template client) :
The implementation must allow templating for this element according to
the following pattern.
template client XHTML view, view01.xhtml
<ui:composition template="template.xhtml">
<ui:define name="metadata">
<f:metadata>
<f:viewParam name="id"/>
</f:metadata>
</ui:define>
<ui:define name="content">
<h1>The big news stories of the day</h1>
</ui:define>
</ui:composition>
Note line 4. The page author must ensure that the <f:metadata> element
does not appear on a template or included page. It must reside on the
root page that corresponds to the viewId.
The template page, template.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xml:lang="en" lang="en">
<body>
<f:view>
<ui:insert name="metadata"/>
<div id="container">
<ui:insert name="content"/>
</div>
</f:view>
</body>
</html>
The page author is not required to use templating, but if they do, it
must be done as shown above
Related
What is the best way to use f:importConstants inside of a composite component?
You can't place f:metadata there, so what is the best workaround here?
With Omnifaces and o:importConstants in JSF 2.2, that was no problem, it was allowed everywhere, even in composite component.
Thanks in Advance :)
Since <f:importConstants> must be a child of <f:metadata> (which in turn must be a child of <f:view>), it must use same compositing pattern as described in the official documentation:
The implementation must allow templating for this element according
to the following pattern.
template client XHTML view, view01.xhtml
<ui:composition template="template.xhtml">
<ui:define name="metadata">
<f:metadata>
<f:viewParam name="id"/>
</f:metadata>
</ui:define>
<ui:define name="content">
<h1>The big news stories of the day</h1>
</ui:define>
</ui:composition>
Note line 4. The page author must ensure that the <f:metadata> element does not
appear on a template or included page. It must reside on the root page that
corresponds to the viewId.
The template page, template.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xml:lang="en" lang="en">
<body>
<f:view>
<ui:insert name="metadata"/>
<div id="container">
<ui:insert name="content"/>
</div>
</f:view>
</body>
</html>
This question already has answers here:
How to use <h:form> in JSF page? Single form? Multiple forms? Nested forms?
(2 answers)
Closed 6 years ago.
As per HTML standard nested form not allowed and JSF follow same thing but if we have design like below
MainPage.xhtml
<ui:composition template="../templates/home.xhtml">
<ui:define name="content">
<h:form>
<rich:panel>
..........................................
..........................................
</rich:panel>
<rich:panel>
<ui:insert name="createLinkTemplate">
<ui:include src="../pages/page.xhtml" />
</ui:insert>
</rich:panel>
<h:form>
</ui:define>
</ui:composition>
Content inside page.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<h:head>
</h:head>
<h:body>
<h:form id="formID">
<rich:panel>
..........................
............................
............................
</rich:panel>
</h:form>
</h:body>
</html>
is this come under the nested case ?
home-template.xhtml content
<?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:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:c="http://java.sun.com/jsp/jstl/core">
...................................................
...................................................
...................................................
<rich:panel styleClass="tabs-main" id="tabsMain">
<h:form id="contentform">
<ui:insert name="content"/>
</h:form>
</rich:panel>
</h:body>
</html>
Along with that one more question First i am alnding to Main.xhtml page from here i am going to page.xhtml and when from there i am coming back all the value which i write in textbox or select from drop down gone and i got a empty form .
Forms are nested when they are nested in the resulting page - the shape of templates and includes has nothing to do with this.
Browser has no way of knowing where <form> tags come from. All it sees is that there are two form tags, one placed in the other.
I'm working on a web solution using myfaces and primefaces. We have several pages in our solution, and some of the get this mystical error myfaces not defined because there is a javascript file that is not included on the page, namely the jsf.js file:
<script type="text/javascript" src="/driwkraft-hig/javax.faces.resource/jsf.js.xhtml?ln=javax.faces&stage=Development">
The error occurs when clicking on certain commandlinks on the page, where the generated javascript has been set to onClick="myfaces.oam.submitForm...
Now, I understand that this is something that the JSF framework adds to the page based on some mystical criteria which I fail to understand. There are pages that appear to be equal with regards to what elements are used, and it succeeds on one and fails on the other.
I have tried to create a test-file where I copied content of one of the failing pages and then removed parts until it would work to figure out what was the source of the problem, but this did not give me anything. My next hunch is that it might be some configuration-error somewhere. But I am completely and utterly blank as to where to start.
I understand I should probable add some code or xml in to this question, but I cannot post the entire solution so I think it is best to do so upon request. Would the web.xml be useful? How about the faces-config.xml?
Any guidance and thoughts are much appreciated!
Edit - adding template
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<ui:insert name="metadata" />
<h:head>
....
<title>
<ui:insert name="title">
....
</ui:insert>
</title>
</h:head>
<h:body>
....
<ui:insert name="content">
....
</ui:insert>
...
</h:body>
</html>
Edit - adding template client
<!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"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:dp="http://java.sun.com/jsf/composite/dapsys">
<ui:composition template="/templates/default.xhtml">
<ui:define name="title">TITLE</ui:define>
<ui:define name="metadata">
<f:metadata>
<f:viewParam name="customerId" value="#{CustomerController.customerId}">
</f:viewParam>
<f:viewParam name="edit" value="#{CustomerController.edit}">
</f:viewParam>
<f:viewParam name="activeTab" value="#{CustomerController.activeTab}">
</f:viewParam>
</f:metadata>
</ui:define>
<ui:define name="content">
...
</ui:define>
</ui:composition>
</html>
It's auto-included if there's a <h:head> in the template which automatically renders CSS/JS dependencies from UIViewRoot#getComponentResources() which are added via #ResourceDependency annotation on the JSF component.
Those problem symptoms suggests that there's no <h:head> in the template, but a plain <head>. Therefore JSF is unable to auto-include CSS/JS resource dependencies which in turn causes this JS error.
To fix this problem, just make sure that there's a <h:head> instead of <head> in the template.
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head> <!-- Look here. -->
<title>Blah</title>
</h:head>
<h:body>
<h1>Blah</h1>
<p>Blah blah.</p>
</h:body>
</html>
I am using JSF to render an HTML page. I design the page like it :
<f:view xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="language" content="fr" />
<title><ui:insert name="title">My app</ui:insert></title>
</h:head>
<h:body>
<div id="top">
<ui:include src="/header.xhtml"/>
</div>
<h:panelGroup id="center" layout="block" >
<ui:insert name="center"/>
</h:panelGroup>
<div id="bottom">
<ui:include src="/footer.xhtml"/>
</div>
</h:body>
This template has some "client" pages, like this one :
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
template="/layouts/master.xhtml">
<ui:define name="center">
<ui:define name="title"><h:outputText value="#{myBean.description}"/></ui:define>
<ui:include src="#{myBean.url}"/>
</ui:define>
In the client, i have to add meta information in the header. It would be great if we have tag like outputScript or outputStylesheet which can be set everywhere in the document and rendered in the html "head" tag.
I have found nothing to do this. Is there a way to add tag in the header when i am in this situation ?
Thank you !
The <h:outputStylesheet> is always automatically relocated to <h:head>, so you don't need to worry about this. For <h:outputScript>, which is by default rendered at the same line as where it's been declared, you can just set the target attribute to head, this way it will automatically be relocated to the <h:head> as well.
<ui:define name="center">
<h:outputStylesheet name="css/style.css" />
<h:outputScript name="js/script.js" target="head" />
...
</ui:define>
For other HTML head meta information, whenever necessary for some reason, you could just declare another <ui:insert>.
<h:head>
<ui:insert name="htmlhead" />
</h:head>
which you can use as follows
<ui:define name="htmlhead">
<meta ... />
</ui:define>
See also:
How to reference CSS / JS / image resource in Facelets template?
I have problems including a facelet template. I wanted to split some content up, so that I can reuse it somewhere else.
So I changed this code:
<!DOCTYPE html>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/layout/template.xhtml">
<ui:define name="head">
<title>Title</title>
</ui:define>
<ui:define name="header">
<h3>Header</h3>
</ui:define>
<ui:define name="content">
<table><tr><td>table</td></tr></table>
</ui:define>
</ui:composition>
To this:
<!DOCTYPE html>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/layout/template.xhtml">
<ui:define name="head">
<title>Title</title>
</ui:define>
<ui:include src="/admin/admin_generic.xhtml"/>
</ui:composition>
And inside admin-generic.xhtml I wrapped the code in a ui:composition.
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:define name="header">
<h3>Header</h3>
</ui:define>
<ui:define name="content">
<table><tr><td>table</td></tr></table>
</ui:define>
</ui:composition>
But nothing is shown. I just get a blank page, with no errors. Is it wrong using ui:composition? I have tried with ui:component but that didn't help either.
Update: According to my Facelets Essentials Guide, it says:
The ui:include tag can be used to include another Facelets file into your
document. It simply includes whatever source file you specify. You can
include any Facelets file that has ui:component or ui:composition tags
(which trim the content outside themselves) or simply a fragment of
XHTML or XML.
Is that what is going on? Is the content outside of the include trimmed away? How can I just include the page, without the content outside being trimmed?
The <ui:define> has to be placed in an <ui:composition> or <ui:decorate> with a template containing the appropriate <ui:insert> tags. You've moved it to an <ui:composition> without a template. No template means no content.
Technically, to achieve your requirement, you have to replace the <ui:include> by <ui:insert>.
<!DOCTYPE html>
<ui:composition
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="template.xhtml">
<ui:define name="head">
<title>Title</title>
</ui:define>
<ui:insert />
</ui:composition>
And declare the above page (I assume it as somepage.xhtml) as template in admin_generic.xhtml.
<!DOCTYPE html>
<ui:composition
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="somepage.xhtml">
<ui:define name="header">
<h1>Header</h1>
</ui:define>
<ui:define name="content">
<table><tr><td>table</td></tr></table>
</ui:define>
</ui:composition>
Note that you have to open admin_generic.xhtml in the browser instead. If your intent is to open somepage.xhtml in browser, then the <ui:define> really has to stay in somepage.xhtml. You can however replace the body of <ui:define> by a simple <ui:include>.
<!DOCTYPE html>
<ui:composition
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="template.xhtml">
<ui:define name="head">
<title>Title</title>
</ui:define>
<ui:define name="header">
<h1>Header</h1>
</ui:define>
<ui:define name="content">
<ui:include src="admin_generic.xhtml" />
</ui:define>
</ui:composition>
It allows for <ui:composition>, so you don't necessarily need to put the <table> to root.
<!DOCTYPE html>
<ui:composition
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<table><tr><td>table</td></tr></table>
</ui:composition>
I solved this by removing the <ui:composition> and the <ui:define> and just adding the namespace directly in the <table> like this:
<table class="adminform" xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a="http://richfaces.org/a4j">
So now my page looks like this:
<ui:define name="content">
<ui:include src="/admin/admin_generic.xhtml" />
</ui:define>