JSF 2 outputFormat example

In JSF web application, “h:outputFormat” tag is similar with “h:outputText” tag, but with extra function to render parameterized message. For example,

<h:outputFormat value="param0 : {0}, param1 : {1}" >
 	<f:param value="Number 1" />
 	<f:param value="Number 2" />
</h:outputFormat>

It will output the following result

param0 : Number 1, param1 : Number 2

{0} match to <f:param value=”Number 1″ />
{1} match to <f:param value=”Number 2″ />

OutputFormat example

See few use cases of “h:outputFormat” tag coded in JSF 2.0 web application.

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 = "Hello {0}";
	public String htmlInput = "<input type=\"{0}\" {1} />";
 
	//getter and setter methods...
}

2. View Page

Page with few “h:outputFormat” 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"
      xmlns:f="http://java.sun.com/jsf/core"
      >
    <h:body>
      <h1>JSF 2.0 h:outputFormat Example</h1>
      <ol>
    	<li>
    	  <h:outputFormat value="this is param 0 : {0}, param 1 : {1}" >
 		<f:param value="Number 1" />
 		<f:param value="Number 2" />
 	  </h:outputFormat>
 	</li>
 	<li>
 	  <h:outputFormat value="#{user.text}" >
 		<f:param value="mkyong" />
 	  </h:outputFormat>
 	</li>
	<li>
	  <h:outputFormat value="#{user.htmlInput}" >
 		<f:param value="text" />
 		<f:param value="size='30'" />
 	  </h:outputFormat>
	 </li>
	 <li>
	  <h:outputFormat value="#{user.htmlInput}" escape="false" >
 		<f:param value="text" />
 		<f:param value="size='30'" />
 	  </h:outputFormat>
	 </li>
	 <li>
	  <h:outputFormat value="#{user.htmlInput}" escape="false" >
 		<f:param value="button" />
 		<f:param value="value='Click Me'" />
 	  </h:outputFormat>
	 </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:outputFormat Example</h1> 
    <ol> 
    	<li>
	   this is param 0 : Number 1, param 1 : Number 2
 	</li> 
 	<li>
	   Hello mkyong
 	</li> 
	<li>
	   &lt;input type=&quot;text&quot; size='30' /&gt;
	</li> 
	<li>
	   <input type="text" size='30' /> 
	</li> 
	<li>
	   <input type="button" value='Click Me' /> 
	</li> 
     </ol>
  </body> 
</html>