How to let JSF pass through HTML attributes

Question

I am using Primefaces 3 in JSF 2 to make a search box. I need to add a non-standard attribute (x-webkit-speech) to the control so you would have something like this...

<p:autoComplete x-webkit-speech="x-webkit-speech" ... />

Since this attribute isn't part of the autoComplete control JSF gives me a 500 error. But when I remove it, the page renders fine. In general, how do you specify pass through attributes on a JSF tag so they are ignored?

take a look at this http://stackoverflow.com/a/6675592/617373 — Daniel, May 08 '12 at 07:34

BalusC · Accepted Answer · 2020-05-03T23:02:16.840

JSF by design ignores all custom attributes when rendering HTML.

If you're already on JSF 2.2+, simply specify it as passthrough attribute:

<html ... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
...
<p:autoComplete a:x-webkit-speech="x-webkit-speech" ... />

If you're not on JSF 2.2 yet, then you need a custom renderer. This is in case of PrimeFaces <p:autoComplete> (and all other components) fortunately relatively simple. It's sufficient to override just the renderPassThruAttributes() method wherein you add the new attribute which you'd like to render to the attrs argument and finally delegate to the super method.

E.g.

package com.example;

import java.io.IOException;

import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;

import org.primefaces.component.autocomplete.AutoCompleteRenderer;

public class MyAutoCompleteRenderer extends AutoCompleteRenderer {

    @Override
    protected void renderPassThruAttributes(FacesContext facesContext, UIComponent component, String[] attrs) throws IOException {
        String[] newAttrs = new String[attrs.length + 1];
        System.arraycopy(attrs, 0, newAttrs, 0, attrs.length);
        newAttrs[attrs.length] = "x-webkit-speech";
        super.renderPassThruAttributes(facesContext, component, newAttrs);
    }

}

To get it to run, register it as follows in your webapp's faces-config.xml:

<render-kit>
    <renderer>
        <component-family>org.primefaces.component</component-family>
        <renderer-type>org.primefaces.component.AutoCompleteRenderer</renderer-type>
        <renderer-class>com.example.MyAutoCompleteRenderer</renderer-class>
    </renderer>
</render-kit>

(you can find out the component family and renderer type by looking at the source code of AutoComplete class, they're specified as COMPONENT_FAMILY and RENDERER_TYPE constants in there)

No, the @FacesRenderer annotation simply won't work when the purpose is to override custom renderers which are by itselves already registered in a faces-config.xml.

Would it be possible to only have the renderer fire for certain autocomplete components? — Adam, May 12 '12 at 17:38
No. You'd need to create a custom UI component. Just extending PrimeFaces `AutoComplete` and overridding `getRendererType()` to return a different value e.g. `com.example.MyAutoCompleteRenderer` ought to be sufficient. Register it in a `.taglib.xml` file and change `` accordingly. Finally use that component instead as ``. — BalusC, May 12 '12 at 17:41
where can I look up the render class to extend h:commandLink to accept custom html attributes? — Matthias B, Oct 20 '12 at 12:41
Maby reference modern jsf passtrough attributes here? or point to https://stackoverflow.com/questions/16666472/custom-html-tag-attributes-are-not-rendered-by-jsf — Kukeltje, May 03 '20 at 18:04

Tires · Answer 2 · 2014-07-18T13:37:05.820

1

The most Tags can be extended, using the Attribute-Tag from JSF-Ext.

<html xmlns:h="http://java.sun.com/jsf/html" xmlns:e="http://java.sun.com/jsf/ext">
    <!-- ... -->
    <h:inputText id="name" value="#{bean.name}">
        <e:attribute name="placeholder" value="My Name"/>
    </h:inputText>
    <!-- ... -->
</html>

You can configure it via maven:

<dependency>
    <groupId>com.intersult</groupId>
    <artifactId>jsf-ext</artifactId>
    <version>2.2.0.1</version>
</dependency>

JSF-Ext is a library from http://www.intersult.com/wiki/page/JSF%20Ext

edited Jul 18 '14 at 13:37

answered Sep 12 '12 at 15:02

Tires

1,529
16
27

What exactly does not work, could you provide an example? I'm using this feature all time in productive projects. – Tires Jan 03 '13 at 02:40
when I add this to pom.xml my persistence context is not recognized anymore ... strange thing, cann not find any reasonable cause – simonC Jul 07 '14 at 12:19
JSF-Ext is not designed to affect any persistence context – Tires Aug 18 '14 at 11:51

score 0 · Answer 3 · answered May 08 '12 at 07:25

0

I am not sure if this is possible at all. I would add those attributes on the client side using javascript or jQuery.

You can put el expressions into your javascript code if you want to integrate server-side stuff.

answered May 08 '12 at 07:25

Matt Handy

29,855
2
89
112

How to let JSF pass through HTML attributes

3 Answers3

Linked