Online Training Spring Hibernate Training in Delhi R Programming Training Course Big Data and Hadoop Training Java Training

JSF Tags

JSF application typically uses JSP pages to represent views. JSF provides useful special tags to enhance these views. Each tag gives rise to an associated component.


JSF Tutorials: Easy steps to learn JSF Java Server Faces (JSF) Tutorials What is JSF Mojarra? JSF Life Cycle JSF Examples JSF Tutorial For Beginners Roseindia JSF Tutorial JSF core Tag Reference JSF internationalization example Tomahawk selectOneCountry tag RCFaces About Hibernate, Spring and JSF Integration Tutorial Creating Login Page In JSF using NetBeans JSF Hello World Declaring the Bean class in the faces-config.xml file Creating a Web Application with the JSF Framework Binding the Form Elements With the Bean Properties Adding Navigation in JSF Application Binding Component Instance to a Bean Property Tomahawk validateEqual tag Tomahawk validateEmail tag Tomahawk validateCreditCard tag Tomahawk selectOneListbox tag Tomahawk selectManyListbox tag Tomahawk selectManyCheckbox tag Tomahawk selectBooleanCheckbox tag Tomahawk saveState tag Tomahawk popup tag Tomahawk inputCalendar tag Tomahawk htmlTag tag Tomahawk graphicImage tag Tomahawk documentHead tag Tomahawk documentBody tag Tomahawk document tag Tomahawk column tag DataBase Connectivity with MySql in Visual Web JSF Application Using Net Beans IDE Retrieve Image in JSF From MySQL Table Using NetBeans IDE JSF Training Java Sever Faces 1.2 - JSF 1.2 Display Data from Database in JSF Application Business Objects of Business Logic tier Setup MySQL Database Working with Database through JDBC Working with JavaScript & CSS Referencing a Localized Message Referencing Resource Bundle from a Page Binding Component Value to an Implicit Object Phase Listener Value Change Event Listener Action Event Listener

JSF Tags


JSF application typically uses JSP pages to represent views. JSF provides useful special tags to enhance these views. Each tag gives rise to an associated component. JSF provides 43 tags in two standard JSF tag libraries:

  1. JSF Core Tags  Library and 

  2. JSF Html Tags Library

Even a very simple page uses tags from both libraries.

<%@ taglib uri=” “ prefix=”f” %>
<%@ taglib uri=” “ prefix=”h” %>

In the above code fragment we have imported two JSF tag libraries with the help of taglib directive. JSF Core Tag Library contains set of JSF core tags while JSF Html Tags Library contains set of html tags. Prefix is used to use tags defined in tag library. Here we are using conventional names f and h for Core & Html tags respectively. We have the choice to choose any name for the prefixes. 

  • JSF Html Tags:

    These tags represent html components like text fields, buttons, form.
    Html tags can be divided into following categories:

    Inputs   (inputText, inputTextarea)
    Outputs  (outputText, outputLabel)
    Commands   (commandButton)
    Selections  (selectOneRadio, selectOneListbox, selectOneMenu for radio buttons, list boxes, menu etc)
    Layouts  (panelGrid)
    Data table  (dataTable)
    Errors and messages   (message, messages)

    Some examples have been given below to understand how to use these tags and its attributes:

          <h:inputText id=?ID1? value=?value?/> 
    creates a single line text input control  where  id attribute is used to uniquely identify the component rendered by this tag and value attribute sets the current value of the component.  

       <h:outputText id="ID2" value="Welcome"/>
    creates a single line text output where id attribute uniquely identifies the rendered component and current value is set by value attribute .


    creates a command button where value attribute sets the value that is displayed on the button when it is rendered and action attribute is used to invoke a method defined in backing bean when a user does an action on the component .According to the return of the invoked method it is determined which view is to be displayed next.

    In JSF Html Tag Library there are 25 core tags .

    All JSF Html Tags :

    • column    creates column in a dataTable
    • commandButton  creates button
    • commandLink   creates link that acts like a pushbutton
    • dataTable   creates a  table control
    • form   creates a form
    • graphicImage  displays an image
    • inputHidden  creates hidden field
    • inputSecret   creates input control for password
    • inputText  creates  text input control (single line)
    • inputTextarea  creates  text input control (multiline)
    • message   displays the most recent message for a component
    • messages  displays all messages
    • outputFormat  creates  outputText, but formats compound messages
    • outputLabel  creates label 
    • outputLink  creates anchor
    • outputText  creates single line text output
    • panelGrid creates html table with specified number of columns
    • panelGroup  used to group other components where the specification requires one child element
    • selectBooleanCheckbox creates checkbox
    • selectManyCheckbox   creates set of checkboxes
    • selectManyListbox   creates multiselect listbox
    • selectManyMenu  creates multiselect menu
    • selectOneListbox  creates single select listbox
    • selectOneMenu  creates single select menu
    • selectOneRadio  creates set of radio buttons
  •  JSF Core Tags:

    These tags allows you to take advantages of features of JSF framework, like validation, conversion , event handling. Core library is stepchild of Html library. i.e. core library supports the html library. Core tag library also contains tags for views and sub-views , loading resource bundle, adding arbitrary text to a page. Some examples of JSF core tags are:

    f: view  tag is used to create top level view
    f: subview tag is used to create subview of  a view.
    f: validator tag is used to add a validator to a component.
    f: converter tag is used to add an arbitrary converter to a component.
    f: actionListener tag is used to add an action listener to a component.
    f:valueChangeListener tag is used to add a valuechange listener to a component

    Some examples have been given below to understand how to use these tags:

    <f:view locale="en">
      <h:outputText value="label" />
    f: view  tag is used to create top level view and is a container for all JSF component tags on a page. Where locale attribute  provides several options for presenting  localized views of your application. Here "en" represents English and if we give velue "fr" to locale attribute then french view will be displayed. So this attribute is useful for internationalization purpose.

      <f:subview id="sub_id">
      <c:import url="second.jsp" />
    Here f:subview tag is like container for the JSF components contained in an included JSP page (second.jsp).

    <h:inputText id="txt_id" 
      <f:validator validatorId="Txt_Validator" /> 
    The Validator tag registers a  Validator  on the component associated with the enclosing tag. In validatorId field, we give the value of one of the validator-id element of a validator in your Faces configuration file.

In JSF Core Tag Library there are 18 core tags .

All JSF Core Tags:

  • f :view     Creates the top-level view
  • f:subview   Creates a subview of a view
  • f:attribute   Adds an attribute  to a component
  • f:param    Constructs a parameter component
  • f:converter      Adds an arbitrary converter to a component
  • f:converterDateTime    Adds a datetime converter to a component
  • f:converterNumber   Adds a number converter to a component
  • f:actionListener      Adds an action listener to a component
  • f:valueChangeListener     Adds a valuechange listener to a component
  • f:validator    dds a validator to a component
  • f:validateDoubleRange    Validates a double range for a component?s value
  • f:validateLength   Validates the length of a component?s value
  • f:validateLongRange    Validates a long range for a component?s value
  • f:facet     Adds a facet to a component
  • f:loadBundle    Loads a resource bundle, stores properties as a Map
  • f:selectitems    Specifies items for a select one or select many component
  • f:selectitem     Specifies an item for a select one or select many component
  • f:verbatim    Adds markup to a JSF page


Share on Google+Share on Google+

JSF Tags

Posted on: May 23, 2007 If you enjoyed this post then why not add us on Google+? Add us to your Circles



Discuss: JSF Tags   View All Comments

Post your Comment

Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
May 30, 2011

needs some more elobaration
October 10, 2011

vey goo.thank you..