JSF 2 outputText example

In JSF 2.0 web application, “h:outputText” tag is the most common used tag to display plain text, and it doesn’t generate any extra HTML elements. See example…

1. Managed Bean

A managed bean, provide some text for demonstration.


import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name="user")
@SessionScoped
public class UserBean{

	public String text = "This is Text!";
	public String htmlInput = "<input type='text' size='20' />";
	
	//getter and setter methods...
}

2. View Page

Page with few “h:outputText” tags example.

JSF…


<?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">

    <h:body>
    	<h1>JSF 2.0 h:outputText Example</h1>
    	<ol>
    	   <li>#{user.text}</li>
    	
 	   <li><h:outputText value="#{user.text}" /></li>
		
	   <li><h:outputText value="#{user.text}" styleClass="abc" /></li>
		
	   <li><h:outputText value="#{user.htmlInput}" /></li>
		
	   <li><h:outputText value="#{user.htmlInput}" escape="false" /></li>
	 </ol>
    </h:body>
</html>

Generate following HTML code…


<!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">
   <body> 
    	<h1>JSF 2.0 h:outputText Example</h1> 
    	<ol> 
    	   <li>This is Text!</li> 
    	
           <li>This is Text!</li> 
		
	   <li><span class="abc">This is Text!</span></li> 
		
	   <li><input type='text' size='20' /></li> 
		
	   <li><input type='text' size='20' /></li> 
	</ol>
   </body> 
</html>
  1. For case 1 and 2
    In JSF 2.0, you don’t really need to use “h:outputText” tag, since you can achieve the same thing with direct value expression “#{user.text}”.
  2. For case 3
    If any of “styleClass”, “style”, “dir” or “lang” attributes are present, render the text and wrap it with “span” element.
  3. For case 4 and 5
    The “escape” attribute in “h:outputText” tag, is used to convert sensitive HTML and XML markup to the corresponds valid HTML character.
    For example,

    1. < convert to &lt;
    2. > convert to &gt;
    3. & convert to &amp;

    By default, “escape” attribute is set to true.

Note
See complete list of sensitive HTML and XML markup here…
http://www.ascii.cl/htmlcodes.htm

3. Demo

URL : http://localhost:8080/JavaServerFaces/

jsf2-outputtext-example

Download Source Code

Download It – JSF-2-OutputText-Example.zip (9KB)

Reference

  1. JSF <h:outputText /> JavaDoc

About the Author

author image
mkyong
Founder of Mkyong.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments

avatar
6 Comment threads
1 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
7 Comment authors
Walter L.balachander sFelipe HugglerrajeshApeksh Recent comment authors
newest oldest most voted
Walter L.
Guest
Walter L.

Wouldn’t #4 in the generated HTML output be:

<li>&lt;input type=’text’ size=’20’ /&gt </li>

if it’s going to be rendered literally?

balachander s
Guest
balachander s

Dear all,
I need to implement comment box and reply for the comment in my (lab assignment’s) website using jsf or primefaces.
Please help me if you have some ideas.

Felipe Huggler
Guest
Felipe Huggler

Hi. I have a include . I need print in my page the src of the component. Sample: mycomponente. Is possible?

rajesh
Guest
rajesh

As value I added html content generated by birt report . it works fine but when if update it the change is not reflected.

Apeksh
Guest
Apeksh
 You are an Idiot 
Janak
Guest
Janak

Hi,
Nice thing…but what will you say for preventing XSS.
escape : true or false??

Ninja
Guest
Ninja

It does not work when I use MyFaces implementation.