Tuesday, January 21, 2014

HTML5 support with passthrough attributes

Prior to JSF 2.2 the responsibility of rendering the web page HTML code was delegated to the JSF component itself or its respective Renderer. This implied that only tags, attributes and styles already provided and hard coded in the component by its vendor could be used. Two problems aroused here. First, as HTML5 specification matured you couldn't render new attributes like placeholder or type on your inputs generated by existing JSF components. Second, you wouldn't also be able to use a non-standard attribute on an existing HTML element (for integration with frameworks like the now very popular Twitter-originated Bootstrap).

JSF 2.2 provides 3 different ways of solving this problem with passthrough attributes:

  1. Using the "http://xmlns.jcp.org/jsf/passthrough" namespace and declaring the passthrough attributes as component attributes.
  2. Using the "<f:passThroughAttribute>" element and declaring each attribute declaratively.
  3. Using the "<f:passThroughAttributes>" element and using a bean property or method on your code that returns a Map<String,String>.
IntelliJ IDEA support for JSF 2.2 passthrough attributes

In all the cases the output generated by JSF (Mojarra implementation) is something like this:

You can notice the presence of the "type" and "placeholder" attributes as declared in the project.