JSF - ui:remove Tag

ui:remove tag is used to prevent the JSF specific code to be rendered on the client side. It is used especially to prevent commented out code to be rendered on the 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.

Step Description
1 Create a project with a name helloworld under a package com.tutorialspoint.test as explained in the JSF - First Application chapter.
2 Modify home.xhtml as explained below. Keep rest of the files unchanged.
3 Compile and run the application to make sure business logic is working as per the requirements.
4 Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver.
5 Launch 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 the 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>
jsf_facelets_tags.htm
Advertisements