f:passThroughAttribute

Thanks to f:passThroughAttribute (since JSF 2.2) it's possible to specify custom values for HTML attributes that doesn't exist in the tag where it is used.

General Usage

For this example, you will need an HTML5 capable browser. We are using a known HTML5 attribute for input elements, which will let us to render a number spinner using the native feature in browser.

Source Code

<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://xmlns.jcp.org/jsf/core"
	xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets">

	<h:form>
		<h:inputText id="passThroughNumber" p:type="number" value="#{inputTextModelBean.text}"/>
		<h:commandButton value="#{i18n['submit']}">
			<f:ajax execute="passThroughNumber" render="@form"/>
		</h:commandButton>				
		<h:outputText id="modelValue" value="#{inputTextModelBean.text}"/>
	</h:form>

</ui:composition>
@ManagedBean
@RequestScoped
public class InputTextModelBean {

	private Date date = new GregorianCalendar().getTime();
	private String text;

	public Date getDate() {
		return date;
	}

	public String getText() {
		return text;
	}

	public void setDate(Date date) {
		this.date = date;
	}

	public void setText(String text) {
		this.text = text;
	}
}
Liferay Faces Bridge Implementation 5.0.0 + Showcase Common 3.1.1 + Liferay Faces Util 3.4.1 + Mojarra 2.2.20