Page componentization can bring many advantages. When multiple pages reference the same page, we only need to maintain the code of one page, greatly reducing the workload of developers.
Assume that the root directory of the website is jsfApp and the jsfApp/resources/echo directory is created. resources is the default root directory of the page to be componentized, and echo is the prefix of the component.
Step 1
Add the jsfApp/resources/echo/echoInputText.xhtml file. The content is as follows:
[Html]
<? 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"
Xmlns: f = "http://java.sun.com/jsf/core"
Xmlns: c = "http://java.sun.com/jsp/jstl/core"
<STRONG> xmlns: composite = "http://java.sun.com/jsf/composite" </STRONG>
<H: head>
<Title> myjsf </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
</H: head>
<! -- INTERFACE -->
<Composite: interface>
<Composite: attribute name = "echo"/>
</Composite: interface>
<! -- IMPLEMENTATION -->
<Composite: implementation>
<Div style = "padding: 20px;">
<Span> enter the response text: </span>
<H: inputText value = "# {cc. attrs. echo. echoText}"> </Div>
</Composite: implementation>
</Html>
<? 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"
Xmlns: f = "http://java.sun.com/jsf/core"
Xmlns: c = "http://java.sun.com/jsp/jstl/core"
Xmlns: composite = "http://java.sun.com/jsf/composite">
<H: head>
<Title> myjsf </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
</H: head>
<! -- INTERFACE -->
<Composite: interface>
<Composite: attribute name = "echo"/>
</Composite: interface>
<! -- IMPLEMENTATION -->
<Composite: implementation>
<Div style = "padding: 20px;">
<Span> enter the response text: </span>
<H: inputText value = "# {cc. attrs. echo. echoText}"> </Div>
</Composite: implementation>
</Html> note [html] view plaincopyprint? <STRONG> xmlns: composite = "http://java.sun.com/jsf/composite" </STRONG>
Xmlns: composite = "http://java.sun.com/jsf/composite" declares that the page component must use the composite namespace.
[Html]
<Composite: interface>
<Composite: interface> the input parameter.
[Html]
<Composite: implementation>
<Composite: implementation> real component content.
Step 2
Add the jsfApp/echo2.xhtml file:
[Html]
<? 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"
Xmlns: f = "http://java.sun.com/jsf/core"
Xmlns: c = "http://java.sun.com/jsp/jstl/core"
Xmlns: echo = "http://java.sun.com/jsf/composite/echo">
<H: head>
<Title> myjsf </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
</H: head>
<Body>
<Div id = "header"
Style = "padding: 100px 0 20px 100px; font-size: 22px; font-weight: bold; border-bottom: solid 1px red">
The speaker is written by # {inputEcho. encoder. author }. </Div>
<Div>
<H: form id = "form" style = "padding: 20px 0 20px 100px">
<Echo: echoInputText echo = "# {inputEcho}"> </echo: echoInputText>
<Div style = "padding-left: 50px">
<H: commandButton id = "post" style = "padding: 3px; width: 100px ;"
Value = "Submit response" action = "echo2"/>
</Div>
</H: form>
</Div>
<H: panelGroup id = "after">
<Div style = "padding: 20px 0 0 100px">
Response:
<H: outputText id = "echo" value = "# {inputEcho. outText}" escape = "false"> </Div>
</H: panelGroup>
</Body>
</Html>
<? 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"
Xmlns: f = "http://java.sun.com/jsf/core"
Xmlns: c = "http://java.sun.com/jsp/jstl/core"
Xmlns: echo = "http://java.sun.com/jsf/composite/echo">
<H: head>
<Title> myjsf </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
</H: head>
<Body>
<Div id = "header"
Style = "padding: 100px 0 20px 100px; font-size: 22px; font-weight: bold; border-bottom: solid 1px red">
The speaker is written by # {inputEcho. encoder. author }. </Div>
<Div>
<H: form id = "form" style = "padding: 20px 0 20px 100px">
<Echo: echoInputText echo = "# {inputEcho}"> </echo: echoInputText>
<Div style = "padding-left: 50px">
<H: commandButton id = "post" style = "padding: 3px; width: 100px ;"
Value = "Submit response" action = "echo2"/>
</Div>
</H: form>
</Div>
<H: panelGroup id = "after">
<Div style = "padding: 20px 0 0 100px">
Response:
<H: outputText id = "echo" value = "# {inputEcho. outText}" escape = "false"> </Div>
</H: panelGroup>
</Body>
</Html>
Use echo prefix
[Html]
Xmlns: echo = "http://java.sun.com/jsf/composite/echo"
Xmlns: echo = "http://java.sun.com/jsf/composite/echo"
Use the echoInputText page and input the echo Parameter
[Html]
<Echo: echoInputText echo = "# {inputEcho}"> </echo: echoInputText>
<Echo: echoInputText echo = "# {inputEcho}"> </echo: echoInputText>
Bean and tool classes are as follows:
[Java]
@ ManagedBean (name = "inputEcho ")
@ SessionScoped
Public class InputEcho implements Serializable {
/**
*
*/
Private static final long serialVersionUID = 7599540489637124942L;
Private String echoText = "";
Private EchoEncoder encoder;
Public InputEcho (){
Encoder = new EchoEncoder ();
}
/**
* @ Return the encoder
*/
Public EchoEncoder getEncoder (){
Return encoder;
}
/**
* @ Return the echoText
*/
Public String getEchoText (){
Return echoText;
}
Public String getOutText (){
Return encoder. Encode (echoText );
}
/**
* @ Param echoText the echoText to set
*/
Public void setEchoText (String echoText ){
This. echoText = echoText;
}
Public void echo (){
}
}
@ ManagedBean (name = "inputEcho ")
@ SessionScoped
Public class InputEcho implements Serializable {
/**
*
*/
Private static final long serialVersionUID = 7599540489637124942L;
Private String echoText = "";
Private EchoEncoder encoder;
Public InputEcho (){
Encoder = new EchoEncoder ();
}
/**
* @ Return the encoder
*/
Public EchoEncoder getEncoder (){
Return encoder;
}
/**
* @ Return the echoText
*/
Public String getEchoText (){
Return echoText;
}
Public String getOutText (){
Return encoder. Encode (echoText );
}
/**
* @ Param echoText the echoText to set
*/
Public void setEchoText (String echoText ){
This. echoText = echoText;
}
Public void echo (){
}
}
[Java]
Package com. zolcorp. myjsf. bean;
Import java. io. Serializable;
Public class EchoEncoder implements Serializable {
/**
*
*/
Private static final long serialVersionUID =-5578888194809870790L;
Private String author = "pout ";
/**
* @ Return the author
*/
Public String getAuthor (){
Return author;
}
Public String Encode (String msg ){
If (msg = null)
Return null;
Return msg. replaceAll ("<", "<"). replaceAll (">", ">"). replaceAll ("\ n", "<br/> ");
}
}
Package com. zolcorp. myjsf. bean;
Import java. io. Serializable;
Public class EchoEncoder implements Serializable {
/**
*
*/
Private static final long serialVersionUID =-5578888194809870790L;
Private String author = "pout ";
/**
* @ Return the author
*/
Public String getAuthor (){
Return author;
}
Public String Encode (String msg ){
If (msg = null)
Return null;
Return msg. replaceAll ("<", "<"). replaceAll (">", ">"). replaceAll ("\ n", "<br/> ");
}
}
Page componentization can greatly reduce the maintenance workload. JSF2 configuration is also very simple.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
