How to let JSF pass through HTML attributes

问题

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?

回答1:

JSF by design ignores all custom attributes when rendering HTML. 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.

回答2:

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

回答3:

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.

来源：https://stackoverflow.com/questions/10484337/how-to-let-jsf-pass-through-html-attributes

标签

html

jsf

jsf-2

primefaces

servlet-3.0