Output string inputText with ajax

Question

I try to get experiment with ajax. I want that string from inputText typing to outpuLabel.

<h:form>
    <h:inputText id="str" value="#{f.str}">
        <f:ajax render="num"/>
    </h:inputText>
    <h:outputLabel id="num" value="#{f.str}">
    </h:outputLabel>
</h:form>

But the value of num update only when i'm typed and clicked the mouse, not during typing to str. How do that the num will be updating during the typing?

score 0 · Accepted Answer · edited May 23 '17 at 11:50

The <f:ajax event> defaults in case of UIInput components to valueChange which renders in case of <h:inputText> the ajax call in the onchange attribute of the generated <input type="text"> element (you can see it yourself by opening the JSF page in webbrowser and do rightclick and View Source).

So, the ajax request is only fired when the HTML DOM change event is fired. That is, when you change the value of the input element and then the input element loses focus (blurs).

As per your functional requirement, you actually want the ajax request to be fired when the HTML DOM keyup event is fired. In that case, you'd need to explicitly specify that.

<f:ajax event="keyup" ... />

Output string inputText with ajax

1 Answers1

See also: