Showing posts with label JSF HTML Tag Reference. Show all posts
Showing posts with label JSF HTML Tag Reference. Show all posts

JSF validator Tag

This tag is used to add and register the validator to the nearest parent component. Typically all applications requires filling some or more information in the page. So it will be better approach to find out the invalid information value or format as soon as possible to make it user friendly. So user can find out faults and correct it. JSF provides built-in validation rules. JSF also helps to customize the validation rules to make it according to the need. If the component has input value then the conversion of the value to the required type is needed and then specified validator type is invoked to check whether this value is of required format and type. This tag contains one attribute named "validatorID" which is required attribute. In this attribute we specify the name of backing bean class where we write functionality according to our need.For custom validation Validator interface is implemented in the class providing validation. You have to maintain the faces-config file where validator-id and validator-class is specified within the validator element. Here, one thing that we have to take care is that validator-id in both places (in faces-config file and validator tag in jsp file ) should match.

Code Description :

<%@ page contentType="text/html" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>






















Backing Bean (Validation.java) : The code below is for backing bean used in this example.

package roseindia;

import javax.faces.*;
import javax.faces.validator.*;
import javax.faces.application.*;
import javax.faces.component.*;
import javax.faces.context.*;
import java.util.regex.*;
public class validation implements Validator{
public validation(){}

public void validate(FacesContext facesContext, UIComponent uIComponent, Object object) throws ValidatorException{
String enteredEmail = (String)object;
Pattern p = Pattern.compile(".+@.+\\.[a-z]+");
Matcher m = p.matcher(enteredEmail);
boolean matchFound = m.matches();

if (!matchFound) {
FacesMessage message = new FacesMessage();
message.setSummary("Invalid Email ID.");
throw new ValidatorException(message);
}
}
}

Now we have to register this class in the faces-config file like below :


..................
..................

checkvalidemail
roseindia.validation

.................
.................

Here in this above case "checkvalidemail" specified in "validator-id" is the alias name (this will be used in jsp file to access the actual backing bean class) of the actual class specified in "validator-class" in the faces-config file. For ex.

Rendered Output :

If we enter incorrect email address then its validation process makes it invalid and shows error message to the user, like below.

Html Source Code :

















This tag contains one attribute :

validatorId : This is the required attribute and is used to specify the ID of the validator class which we are going to use in this validation process (in the case of custom validation). This value must match with the validator-id element specified in validator tag of faces-config file.

read more “JSF validator Tag”

JSF valueChangeListener Tag

This tag is used to add a value change listener to the component associated with the enclosing tag. Value change event is fired when the user changes the input value. This event can be fired with any component which takes user input (select or input components). The class which is registered with the component implements ValueChangeListener interface and implements the method processValueChange(). We write our logic of action in this method. One thing that we have to take care is that we have to use onChange event of java script which submits the form when input is changed. If we will not do this then we will have to submit the form manually. This illustration will explain you how to go ahead.

Code Description :

<%@ page contentType="text/html" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>





onchange="submit()">











MyBean.java :

package roseindia;

import java.util.*;
import javax.swing.*;
import javax.faces.event.*;

public class MyBean implements ActionListener,ValueChangeListener{
String som = "";
private Date today = new Date();
public void processAction(ActionEvent e){
JOptionPane.showMessageDialog(null,"Hi");
}

public void processValueChange(ValueChangeEvent ce){
JOptionPane.showMessageDialog(null, ce.getSource());
}

public String getSom(){
return som;
}

public void setSom(String som){
this.som = som;
}

public Date getToday(){
return today;
}

public void setToday(Date today) {
this.today = today;
}
}

Rendered Output : This is the first page that appears to the user.

When the user changes the current value in the menu then the value change listener is activated and gives its output according to the method processValueChange(). Here, in this example, a message dialog is open and message is shown.

Html Source Code :







This tag contains one attribute :

type : This attribute is used to specify the fully qualified name of the class which has implemented valueChangeListener interface and implemented processValueChange() method.

read more “JSF valueChangeListener Tag”

JSF verbatim Tag

This tag renders output component (UIOutput) within the closest component. It takes the content from the body of this tag. This tag can be used to nest plain html within the JSF component tree. Any Html and jsp tags in the view tag can be nested within verbatim tag. The reason behind it is that all the content inside the f:view tag should be in the JSF component tree. When JSF component tree is rendered, it contains only JSF components. But html and JSP tags are not JSF components. So we nest the non JSF tags to the verbatim tag that treats them as JSF components.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>






This is the testing of verbatim tag of jsf.






Rendered Output :

Html Source Code :





This is the testing of verbatim tag of jsf.




This tag contains attribute :

escape : Its a boolean attribute. Itss default value is "false". If it is made true then the generated markup is escaped.

read more “JSF verbatim Tag”

JSF view Tag

This tag is used to create the top level view. This acts as a container of all the components that are part of the view of the page. Its attribute "locale" is important in the case of making the view internationalized. We can do so by setting the locale attribute to the locale you have to present the view of the page. Suppose we set the locale attribute to "en" or "fr" then the view is presented to the user in English and French respectively. you can also set the locale dynamically and can present the view according to the user.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>















Rendered Output : In the above code all component tags have been embedded in the view tag.

In the above tag we have set the locale attribute to "fr" i.e. French locale. In the above code we have used message tag to display the error message if the input field is left blank. So this message is shown in French because of the locale set in the code. The output is shown below.

Html Source Code :












Attributes that this tag uses are given below :

locale : This attribute is used to set the locale of the view. Its default value is that specified in configuration file. It can take static values or EL expressions.

read more “JSF view Tag”

JSF selectOneRadio Tag

This section is in concern with discussing about "selectOneRadio" tag. This allows the user to select one option from a set of available options. It renders a table which contains "input" elements of type "radio". It renders such a list of options where if you select any other option the previous selection gets automatically deselected. This tag supports two layout "lineDirection" and "pageDirection" for horizontal and vertical .layout determines whether the chenkboxes are laid out horizontally or vertically. lineDirection is the default layout. f:selectItem or f:selectItems are used to provide a list of available options.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>





value="TableBean.perInfoAll" title="Select any one of the choice" layout="pageDirection" border="1">











Rendered Output :

Html Source Code:

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectOneRadio.jsf" enctype="application/x-www-form-urlencoded">
<table border="1" id="_id0:sor">
<tr><td>
<label><input type="radio" name="_id0:sor" value="11" border="1" title="Select any one of the choice"> Thums Upinput>label>td>
tr>
<tr><td>
<label><input type="radio" name="_id0:sor" value="22" border="1" title="Select any one of the choice"> Limcainput>label>td>
tr>
<tr><td>
<label><input type="radio" name="_id0:sor" value="33" border="1" title="Select any one of the choice"> Pepsiinput>label>td>
tr>
<tr><td>
<label><input type="radio" name="_id0:sor" value="44" border="1" title="Select any one of the choice"> Spriteinput>label>td>
tr>
<tr><td>
<label><input type="radio" name="_id0:sor" value="55" border="1" title="Select any one of the choice"> Frootiinput>label>td>
tr>
<tr><td>
<label><input type="radio" name="_id0:sor" value="66" border="1" title="Select any one of the choice"> Coca-Colainput>label>td>
tr>
table>
<input type="hidden" name="_id0" value="_id0" />form>
body>
html>

All the attributes of this tag have been summarized below :

  • id : It is the component identifier that must be unique in the closest container.
  • layout : This attribute is used to set the components either vertically or horizontally by two values "lineDirection" and "pageDirection" respectively.This attribute takes "lineDirection" value bydefault.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • border : It is used to set the border width of the table containing these choices.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • alt : This is used as an alternate text that is displayed when browser is not able to display the element.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectOneRadio Tag”

JSF selectOneMenu Tag

This is the section where you will learn about "selectOneMenu" tag. This is used to display the element that enables the user to select only one among the list of available options. In the menu only one option is displayed at a time. This tag renders an html "select" element of size "1" with no multiple attribute. So have a look on the difference between listbox and menu. listbox can be specified of any size but menu is set to size "1" by default. The choices that we have to display in the list are added by f:selectItem or f:selectItems.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
















Rendered Output :

Html Source Code: Here you can see that size of the element is set to "1" in the html source code.

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectOneMenu.jsf" enctype="application/x-www-form-urlencoded">

<select id="_id0:som" name="_id0:som" size="1" title="select any one in this menu"> <option value="11">Thums Upoption>
<option value="22">Limcaoption>
<option value="33">Pepsioption>
<option value="44">Spriteoption>
<option value="55">Frootioption>
<option value="66">Coca-Colaoption>
select>
<input type="hidden" name="_id0" value="_id0" />
form>
body>
html>

This tag contains some attributes that can be used for different purposes. These attributes are summarized below :

  • id : This attribute is used to uniquely identify the element within the closest container.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute. It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectOneMenu Tag”

JSF selectOneListbox Tag

This section describes you about selectOneListbox tag in detail. This is used when you have to allow the user to select only one option from the list. Actually it renders an html "select" element of any size and no "multiple" attribute. The choices that we have to display in the list are shown by f:selectItem or f:selectItems. size attribute is used to set the number of options to display at a time. If its size is not specified then it shows all the choices i.e. its default size is equal to no. of available options. If we set size attribute to less than the total no. of available choices then a scrollbar appears and the number of elements specified in the size attribute are shown. We can see other options by moving the scrollbar down and up. If size is set to "1" then drop down menu is rendered. So instead of using this strategy, its good to use "selentOneMenu" tag provided by JSF.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
















Rendered Output :

Html Source Code:

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectOneListbox.jsf" enctype="application/x-www-form-urlencoded">
<select id="_id0:sol" name="_id0:sol" size="3" title="select one option">
<option value="11">Thums Upoption
>
<option value="22">Limcaoption>
<option value="33">Pepsioption>
<option value="44">Spriteoption>
<option value="55">Frootioption>
<option value="66">Coca-Colaoption>
select>
<input type="hidden" name="_id0" value="_id0" />
form>
body>
html>

This tag contains some attributes that can be used for different purposes. These attributes are summarized below :

  • id : This attribute is used to uniquely identify the element within the closest container.
  • size : It is used to determine how many options have to be shown at a time from the list of available options. If it is not specified then all are shown. If size is set to less than the number of available options then scroll bar is rendered.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectOneListbox Tag”

JSF selectManyMenu Tag

In this section "selectManyMenu" tag will be discussed. This is used to select more than one items from a set of options. This renders an html "select" element which contains "multiple" attribute with size "1". This renders the menu of options where only one is visible at a time. The difference between "selectManyListbox" and "selectManyMenu" is that listbox can be set to any size and menu is always set to size "1". Options can be added by the use of f:selectItem or f:selectItems. This tag can render different output in different browsers. In Internet Explorer browser user can select the items by scrolling the arrow icon up and down but its not the case for Mozilla or Netscape browser. In the later case this menu looks like an input text box but many of the items can be selected.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
















Rendered Output :

1) In Mozilla browser :

2) In Internet Explorer :

Html Source Code:

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectManyMenu.jsf" enctype="application/x-www-form-urlencoded">
<select id="_id0:smm" name="_id0:smm" multiple size="1" title="select one or more items">
<option value="11">Thums Upoption
>
<option value="22">Limcaoption>
<option value="33">Pepsioption>
<option value="44">Spriteoption>
<option value="55">Frootioption>
<option value="66">Coca-Colaoption>
select>
<input type="hidden" name="_id0" value="_id0" />form>
body>
html>

This tag can use some attributes that are useful in different places for different purpose. Here is the list of attributes :

  • id : This attribute is used to uniquely identify the element within the closest container.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectManyMenu Tag”

JSF selectManyListbox Tag

This section is dedicated to describe you about selectManyListbox tag. This lets you select more than one options from a set of available options. It renders an html "select" element of specified size with "multiple" attribute. size is used to specify how many options are to be displayed at a time. If size is not specified then it displays all the choices i.e. its default value is equal to no. of available options. If we set this size to "1" then drop down list is rendered. Instead of doing this we can use "selectManyMenu" tag of JSF. If size is specified less than the total no. of available options then scroll bar is rendered which can be used to see all the options by moving it. Options are added by the use of f:selectItem or f:selectItems.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>





title="select one or more options by pressing the control key" size="3">










Rendered Output :

Html Source Code:

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectManyListbox.jsf"
enctype="application/x-www-form-urlencoded">
<select id="_id0:subscriptions" name="_id0:subscriptions" multiple size="3"
title
="select one or more options by pressing the control key">
<option value="11">Thums Upoption
>
<option value="22">Limcaoption>
<option value="33">Pepsioption>
<option value="44">Spriteoption>
<option value="55">Frootioption>
<option value="66">Coca-Colaoption>
select>
<input type="hidden" name="_id0" value="_id0" />
form>
body>
html>

This tag can use some attributes that are useful in different places for different purpose. Here is the list of attributes :

  • id : This attribute is used to uniquely identify the element within the closest container.
  • size : It is used to determine how many options have to be shown at a time from the list of available options. If it is not specified then all are shown. If size is set to less than the number of available options then scroll bar is rendered.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectManyListbox Tag”

JSF selectManyCheckbox Tag

This section is to describe you selectManyCheckbox tag of JSF. It is used to provide the user to select many items from a list of options. The user can select one or more options. This supports two layouts "lineDirection" and "pageDirection".layout determines whether the chenkboxes are laid out horizontally or vertically. lineDirection is the default layout. lineDirection sets the checkboxes in the horizontal direction of the page and pageDirection is used to set the checkboxes in vertical direction of the page. f:selectItem or f:selectItems are used to provide a list of available options. selectManyCheckbox renders these options in a table where each option is set to one cell. Each cell contains the checkbox and label of the option. The value attribute of this tag must be value binding expression. This value can be bound to data type of java like primitive array, object array, List.


Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>






value="#{TableBean.perInfoAll}" border="1" disabled="false"
title="this is 'selectManyCheckbox' demo" layout="lineDirection">











Rendered Output :

Html Source Code:

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages/selectManyCheckbox.jsf"
enctype="application/x-www-form-urlencoded">
Click one or more options below :
<table border="1" id="_id0:smc"><tr><td>
<label><input name="_id0:smc" value="11" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Thums Upinput>label>td>
<td>
<label><input name="_id0:smc" value="22" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Limcainput>label>td>
<td>
<label><input name="_id0:smc" value="33" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Pepsiinput>label>td>
<td>
<label><input name="_id0:smc" value="44" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Spriteinput>label>td>
<td>
<label><input name="_id0:smc" value="55" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Frootiinput>label>td>
<td>
<label><input name="_id0:smc" value="66" type="checkbox" border="1" title=
"this is 'selectManyCheckbox' demo"
> Coca-Colainput>label>
td>
tr>
table><br>
<input type="hidden" name="_id0" value="_id0" />form>
body>
html>

This tag is comprised of many attributes that are summarized below :

  • id : It is the component identifier that must be unique in the closest container.
  • layout : This attribute is used to set the components either vertically or horizontally by two values "lineDirection" and "pageDirection" respectively.This attribute takes "lineDirection" value bydefault.
  • enabledClass : This attribute is used to set the CSS class to the label of disabled choices.
  • disabledClass : This attribute is used to set the CSS class to the label of enabled choices.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server. If it is set to true and value is not provided then an error message comes.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • border : It is used to set the border width of the table containing these choices.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • alt : This is used as an alternate text that is displayed when browser is not able to display the element.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectManyCheckbox Tag”

JSF selectBooleanCheckbox Tag

This section explains you creating checkbox by JSF tag. selectBooleanCheckbox tag is used to create checkbox. This tag renders an html "input" tag whose type is set to "checkbox" and "name" is set to "id". If the "value" of this component is set to "true" then a checked checkbox is rendered. This is used when we want to give an option to the user to select or deselect.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>





title="click it to select or deselect"/>




Rendered Output : In the above code value is set to true so checkbox is rendered as checked. On moving the mouse pointer to the chenkbox element a tooltip pops up that is the text written in title attribute.

Html Source Code :

<html>
<body>
<form id="_id0" method="post" action="/htmltag/pages
/selectBooleanCheckbox.jsf"
enctype="application/x-www-
form-urlencoded"
>
<input id="_id0:checkbox" type="checkbox"
name="_id0:checkbox" checked title="click it to select or
deselect"
/>
Want to participate?
<input type="hidden" name="_id0" value="_id0" />
form
>
body>
html>

This tag contains some attributes that are described below :

  • id : It is the component identifier that must be unique in the closest container.
  • binding : It takes the value binding expression that is used to link the component to the property of the backing bean.
  • rendered : Its a boolean attribute. Its default value is true. It determines whether this component should be rendered or not.
  • value : This is to set the current value of the component.
  • converter : This specifies the converter for the component. This can be static value or EL expression .
  • immediate : Its a boolean attribute. It is used to identify during which phase value change event should occur. If this attribute is set to true then in place of firing the event during the process validation phase, these event are sent immadiately at the end of apply request values phase.
  • required : Its a boolean attribute. It indicates that its value is required by the user before the submission of the form to the server.
  • validator : It takes the method binding expression. This expression represents the validator method. This method is called at the time of validation of the component.
  • valueChangeListener : This also takes a method binding expression. This expression represents value change listener method. This method will be called when new value is set for this component.
  • dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
  • lang : It is used to set the base language of the component when displayed.
  • style : It is used to set the CSS style definition for the component.
  • title : It is the standard html attribute.It is used to set the tooltip text for this component.
  • styleClass : It is used to set the CSS class for the component.
  • onclick : Script to be invoked when the element is clicked.
  • ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
  • onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
  • onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
  • onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
  • onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
  • onmouseout : It is used for Java Script code to be invoked when the pointing device is moves out of this element.
  • onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
  • onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
  • onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
  • accesskey : This is standard html attribute. It is used to set the access key for the element which is used to send the focus to the element when pressed.
  • alt : This is used as an alternate text that is displayed when browser is not able to display the element.
  • disabled : Its a boolean attribute. This is used to disable the element to receive focus, when it is set to true.
  • onblur : It is used to set the java script code to execute when focus is lost from the element.
  • onfocus : It is used to set the java script code to execute when focus is received by the element.
  • onchange : It is used to set the java script code to execute when element is modified.
  • onselect : It is used to set the java script code to execute when element is modified
  • readonly : Its a boolean attribute. It is used to indicate the user that its value can't be modified, if it is set to true.
  • tabindex : This is a standard html attribute. It is used to set the order of receiving the focus on the movement of TAB key by the user.
read more “JSF selectBooleanCheckbox Tag”