Using bootstrap related tags inside JSF2 h:inputText component

Question

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

Answer 1

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:

    
        javax.faces.Input
        javax.faces.Text
        com.example.MyTextRenderer
    
    

---

In JSF 2.2, it's possible by the new passthrough namespace or the tag. See also What's new in JSF 2.2? - HTML5 Pass-through attributes.

Thus, so:

...

(note that the type attribute defaults to text already)

Or:

See also:

• Custom HTML tag attributes are not rendered by JSF