RichFaces Rich:Tooltip

by Online Tutorials Library July 14, 2022

RichFaces <rich:tooltip>

This component provides an informational tool-tip. We can attach tool-tip any control and is displayed when hovering the mouse cursor over the control.

We need to use values attribute for tool-tip text and is usually shown when the mouse cursor hovers.

Style classes and skin parameters

The following tables contains the style classes and corresponding skin parameters for the tooltip.

Class	Function	Skin Parameters	Mapped CSS properties
.rf-tt	It is used to define styles for the tool-tip itself.	No skin parameters.
.rf-tt-loading	It is used to define styles for the tool-tip when it is loading.	No skin parameters.
.rf-tt-cnt	It is used to define styles for the tool-tip content.	No skin parameters.
.rf-tt-cntr	It is used to define styles for the progressed portion of the progress bar.	tipBorderColor generalFamilyFont generalSizeFont	border-color font-family font-size

Example

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

JSF file

// tool-tip.xhtml

  <ui:composition xmlns=”http://www.w3.org/1999/xhtml”  xmlns:h=”http://java.sun.com/jsf/html”  xmlns:a4j=”http://richfaces.org/a4j”  xmlns:rich=”http://richfaces.org/rich”  xmlns:f=”http://java.sun.com/jsf/core”  xmlns:ui=”http://java.sun.com/jsf/facelets”>  <f:view>  <h:head>  <title>ToolTip </title>  </h:head>  <h:body>  <h:form>  <h:outputText value=”User Name ” />  <h:inputText label=”user name”  id=”user-name”  required=”true”  value=”#{user.name}”>  <f:validateLength minimum=”5″ maximum=”20″ />  </h:inputText><br/><br/>  <h:commandButton value=”submit”/>  <rich:tooltip value=”Please Enter User Name ” target=”user-name”/>  </h:form>  </h:body>  </f:view>  </ui:composition>  

ManagedBean

// User.java

  import javax.faces.bean.ManagedBean;  import javax.faces.bean.RequestScoped;  @ManagedBean  @RequestScoped  public class User {  String name;  public String getName() {  return name;  }  public void setName(String name) {  this.name = name;  }  }  

Output:

RichFaces Tooltip 1

Next Topic#

RichFaces Rich:Tooltip

RichFaces <rich:tooltip>

Style classes and skin parameters

Example

JSF file

ManagedBean

Which is the fastest implementation of Python

How to Download and Install Ubuntu 16.04

You may also like