Placeholder component brings functionality similar to HTML5 placeholder together with a backward compatibility for non-compliant browsers and together with additional features:
Placeholder component works with any JSF component which renders input or textarea as well as with non-JSF text inputs (using selector attribute).
Bellow you can see sample of <rich:placeholder /> attached to standard inputs.
<!DOCTYPE html> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:rich="http://richfaces.org/rich"> <rich:panel header="Placeholder"> <h:panelGrid columns="2"> <h:outputLabel value="Input text:" /> <h:inputText id="input"> <rich:placeholder value="Type text here..." /> </h:inputText> <h:outputLabel value="Textarea:" /> <h:inputTextarea id="textarea"> <rich:placeholder value="A space for long content..." /> </h:inputTextarea> <h:outputLabel value="Date:" /> <rich:calendar datePattern="dd/M/yyyy" enableManualInput="true"> <rich:placeholder value="dd/mm/yyyy" /> </rich:calendar> </h:panelGrid> </rich:panel> </ui:composition>
