RichFaces Rich:Select

by Online Tutorials Library July 14, 2022

RichFaces <rich:select>

This component provides a drop-down list box for selecting a single value from multiple options. It is similar to the JSF UISelectOne component.

We can use it in an auto-completing mode, where the values in the drop-down list are provided dynamically using either the autocompleteMethod or autocompleteList attributes.

Style classes and skin parameters

The following table contains the style classes and corresponding skin parameters for the select.

Class	Function	Skin Parameters	Mapped CSS properties
.rf-sel	It is used to define styles for the select control itself.	No skin parameters.
.rf-sel-cntr	It is used to define styles for the container of the select control.	panelBorderColor	border-color
.rf-sel-inp	It is used to define styles for the select control input field.	controlBackgroundColor	background-color
.rf-sel-fld-err	It is used to define styles for the input field when an error occurs.	No skin parameters.
.rf-sel-opt	It is used to define styles for an option in the select control.	generalTextColor generalSizeFont	color font-size
.rf-sel-sel	It is used to define styles for the selected option of the select control.	generalTextColor	border-color
.rf-sel-dflt-lbl	It is used to define styles for the default label of the select control.	No skin parameters.
.rf-sel-btn	It is used to define styles for the button of the select control.	headerBackgroundColor	background-color
.rf-sel-btn-arrow	It is used to define styles for the arrow on the button.	No skin parameters.
.rf-sel-btn-dis	It is used to define styles for the button of the select control when it is disabled.	No skin parameters.
.rf-sel-lst-scrl	It is used to define styles for the list scrollbar.	No skin parameters.
.rf-sel-shdw	It is used to define styles for the select control shadow.	No skin parameters.
.rf-sel-shdw-t, .rf-sel-shdw-b, .rf-sel-shdw-l, .rf-sel-shdw-r	These classes define the top, bottom, left, and right edge of the select control shadows.	No skin parameters.

Example

Here, in the following example, we are implementing <rich:select> component. This example contains the following files.

JSF File

// rich-select.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”>  <ui:composition xmlns=”http://www.w3.org/1999/xhtml”  xmlns:h=”http://java.sun.com/jsf/html”  xmlns:f=”http://java.sun.com/jsf/core”  xmlns:ui=”http://java.sun.com/jsf/facelets”  xmlns:a4j=”http://richfaces.org/a4j”  xmlns:rich=”http://richfaces.org/rich”>  <f:view>  <h:head>  <title>Rich Select Example</title>  </h:head>  <h:body>  <h:form>  <h:outputText value=”Rich Select Example”/><br/><br/>  <rich:select>  <f:selectItems value=”#{country.countryList()}” />  </rich:select>  </h:form>  </h:body>  </f:view>  </ui:composition>  

Managed Bean

// Country.java

  import java.util.ArrayList;  import java.util.List;  import javax.faces.bean.ManagedBean;  import javax.faces.bean.RequestScoped;  @ManagedBean  @RequestScoped  public class Country {  String CountryName;  public List<String> countryList() {  ArrayList<String> list = new ArrayList<>();  list.add(“India”);  list.add(“Australia”);  list.add(“Germany”);  list.add(“Italy”);  list.add(“United States”);  list.add(“Russia”);  return list;  }  public String getCountryName() {  return CountryName;  }  public void setCountryName(String CountryName) {  this.CountryName = CountryName;  }  }  

Output:

RichFaces Select 1

Next TopicRichFaces <rich:orderinglist>

RichFaces Rich:Select

RichFaces <rich:select>

Style classes and skin parameters

Example

JSF File

Managed Bean

Verbal Reasoning | Assertion and Reason 1

Components of Robot

You may also like