Variable is set to null when JSF Ajax call is made

Question

I have a @ViewScoped wordController CDI bean. It has a method addWord() that adds variable currentWord to a List. It works fine with no AJAX, but as soon as I include the f:ajax, the variable currentWord is always null in the addWord() method. There is something I am missing on the way ajax works with JSF. What is going wrong here?

<h:form id="saveForm" styleClass="form">
    <h:inputText value="#{wordController.currentWord}" id="words" />
    <h:commandButton action="#{wordController.addWord()}" type="submit" value="+">
        <f:ajax render="wordlist" />
    </h:commandButton>
    <h:panelGroup id="wordlist">
....

score 5 · Accepted Answer · edited May 23 '17 at 12:15

f:ajax defaults to execute="@this" (which in this case equals to the commandButton), so the inputText is not executed (≈ submitted). Thats why it is null in the action. Just add

<f:ajax execute="@form" render="wordlist" />

to execute the whole form, or

<f:ajax execute="@this words" render="wordlist" />

to only execute the inputText and the button - in case there are more inputcomponents you don't want submitted.

In the latter case you need @this because without it only words would execute, and therefore not the commandButton, and therefore not the action.

Here's more reading.

Variable is set to null when JSF Ajax call is made

1 Answers1