Programatically adding Ajax Behaviour - “Mojarra is not defined”

Question

I have a page using dynamic forms where I am creating the component tree programatically (which is not up for debate in this question) Some of the input controls I need to

Answer 1

Basically, you need this:

<h:outputScript library="javax.faces" name="jsf.js" target="head" />

That script contains the mojarra definition among the standard jsf namespace containing the JSF ajax scripts.

You can explicitly declare it in the <h:head> of your master template, if necessary via <ui:define>/<ui:include>. It won't load duplicate copies of the jsf.js file if already implicitly required by the view.

You can even programmatically create it:

UIComponent jsfjs = new UIOutput();
jsfjs.getAttributes().put("library", "javax.faces");
jsfjs.getAttributes().put("name", "jsf.js");
jsfjs.setRendererType("javax.faces.resource.Script");
FacesContext context = FacesContext.getCurrentInstance();
context.getViewRoot().addComponentResource(context, jsfjs, "head");

Also here, it won't load duplicate copies of the jsf.js file if already implicitly required by the view.

---

Unrelated to the concrete problem, you should prefer <f:event type="postAddToView"> over binding when you need to programmatically populate the component tree:

<h:panelGroup id="id_Group1" layout="block">
    <f:event type="postAddToView" listener="#{questionaire.populateGroup1}" />
</h:panelGroup>

with

public void populateGroup1(ComponentSystemEvent event) {
    HtmlPanelGorup group1 = (HtmlPanelGroup) event.getComponent();
    // ...
}

This guarantees that the tree is populated at exactly the right moment, and keeps getters free of business logic, and avoids potential "duplicate component ID" trouble when #{questionaire} is in a broader scope than the request scope, and keeps the bean free of UIComponent properties which in turn avoids potential serialization trouble and memory leaking when the component is held as a property of a serializable bean.