Effect of ajax on the button

Question

Effect of ajax on the button

Navigation

#1 by (6 votes)

2

No commandButton of primefaces has u ajax attribute that can be true or false . What effect does it have on submission? I'm making a silly example where the user types a name and triggers the button, right after the typed name is displayed. In this case it only works if ajax is false , why?

<h:form>
    <h:panelGrid columns="3">
        <p:outputLabel value="Nome" />
        <p:inputText id="nome" value="#{modelo.nome}"/> 
        <p:outputLabel id="resultado" styleClass="data" rendered="#{!empty modelo.nome}" value="#{modelo.nome}"/>
    </h:panelGrid>
    <p:commandButton id="su" value="Salvar" update="resultado" ajax="false"/>
</h:form>

ajax primefaces

asked by anonymous 22.02.2017 / 17:43

1 answer

Why does "undefined" occur even when defining the exact element to be reached? Scope between variables - Javascript

score 6 · Accepted Answer

The "ajax" option basically says if there is going to be a submit of the page when the button action is triggered and consequently re-rendering all its components. In your case, update would be used to render outputLabel again without submitting the whole page, but it is not working because that component has a rendered condition. What happens is that the update attribute should point to an id of an existing component in the DOM. Because this element is not rendered on the server side, no component is found to be updated. One way to solve this problem is to create another component that surrounds the outputLabel and update this component, since it will not have a rendering condition and therefore will exist in the DOM:

<h:panelGrid columns="3">
    <p:outputLabel value="Nome" />
    <p:inputText id="nome" value="#{modelo.nome}"/> 
    <h:panelGroup id="panel">
       <p:outputLabel id="resultado" styleClass="data" rendered="#{!empty modelo.nome}" value="#{modelo.nome}"/>
    </h:panelGroup>
    <p:commandButton id="su" value="Salvar" update="panel"/>
</h:panelGrid>

Now, updating panelGroup your button will work with AJAX.