Home/ Questions/Q 9319043
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-19T03:17:06+00:00

Is there anyway to use bootstrap related tags in JSF2 components? For example I’m

  • 0

Is there anyway to use bootstrap related tags in JSF2 components? For example I’m interested in using the bootstrap typeahead feature which requires something like 

<h:inputText id="typeahead" type="text" data-provide="typeahead"></h:inputText>

but since data-provide doesn’t exist for h:inputText it gets stripped out and so the typeahead feature would obviously not work.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Depends on JSF version you’re using.

    In JSF 2.0/2.1, it’s not possible to specify additional attributes. The JSF HTML renderers will only render predefined attributes. You’d need to create a custom renderer to achieve the desired job. To minimize boilerplate code, you’re forced to extend the implementation-specific renderer. It’s unclear which one you’re using, so here’s just a Mojarra targeted example:

    import com.sun.faces.renderkit.html_basic.TextRenderer;

public class MyTextRenderer extends TextRenderer {

    @Override
    protected void getEndTextToRender(FacesContext context, UIComponent component, String currentValue) throws IOException {
        Object dataProvide = component.getAttributes().get("data-provide");

        if (dataProvide != null) {
            context.getResponseWriter().writeAttribute("data-provide", dataProvide, null);
        }

        super.getEndTextToRender(context, component, currentValue);
    }

}

    Register it as follows in faces-config.xml to get it to run:

    <render-kit>
    <renderer>
        <component-family>javax.faces.Input</component-family>
        <renderer-type>javax.faces.Text</renderer-type>
        <renderer-class>com.example.MyTextRenderer</renderer-class>
    </renderer>
</render-kit>

    In JSF 2.2, it’s possible by the new passthrough namespace or the <f:passThroughAttribute> tag. See also What’s new in JSF 2.2? – HTML5 Pass-through attributes.

    Thus, so:

    <html ... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
...
<h:inputText id="typeahead" a:data-provide="typeahead" />

    (note that the type attribute defaults to text already)

    Or:

    <h:inputText id="typeahead">
    <f:passThroughAttribute name="data-provide" value="typeahead" />
</h:inputText>

    See also:

    • 0