JSF - ui:remove Tag

Advertisements


ui:remove tag is used the prevent the JSF specific code to be rendered on client side. It is used especially to prevent commented out code to be rendered on client side.

JSF Tag commented out using HTML comment

<!-- JSF code commented out -->
<!-- 
<h:commandButton value="Ok" />  
-->

Rendered Output

<!-- JSF code commented out -->
<!-- 
&lt;h:commandButton value=&quot;Ok&quot; /&gt;  
-->

Now using remove tag we'll see the following change in rendered output.

JSF Tag commented out using remove tag

<!-- JSF code commented out -->
<ui:remove>
   <h:commandButton value="Ok" />  
</ui:remove>

Rendered Output

<!-- JSF code commented out -->

Example Application

Let us create a test JSF application to test the template tags in JSF.

StepDescription
1Create a project with a name helloworld under a package com.tutorialspoint.test as explained in the JSF - First Application chapter.
2Modify home.xhtml as explained below. Keep rest of the files unchanged.
3Compile and run the application to make sure business logic is working as per the requirements.
4Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver.
5Launch your web application using appropriate URL as explained below in the last step.

home.xhtml

<?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:ui="http://java.sun.com/jsf/facelets">
   <h:head>
      <title>JSF tutorial</title>			
   </h:head>
   <h:body>	
      <ui:remove>
         <h:commandButton value="Ok" />  
      </ui:remove>
      <!--
         <h:commandButton value="Cancel" />  
      -->
   </h:body> 
</html>

Once you are ready with all the changes done, let us compile and run the application as we did in JSF - First Application chapter. If everything is fine with your application, you'll see an empty page.

View source of page and you will see the following html text.

home.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"><head>
<title>JSF tutorial</title>
</head>
<body>
   <!--
      &lt;h:commandButton value=&quot;Cancel&quot; /&gt;  
   -->
</body>
</html>


Advertisements
Advertisements