CODEWITHSUNDEEP
ajaxjsf
sorenchristensen
sorenchristensen

Reputation: 107

JSF h:commandButton fires other command buttons within form?

I have a form containing several h:commandButtons - all have f:ajax tags attached. When I trigger one of these command buttons, then I see in the log that all are actualy getting fired - so all actions are called?

Is this normal behaviour of the h:commandButton + f:ajax combination?

I'm using action attribute of commandButton and not the listener on f:fajax.

Hope someone can explain this to me.

Thanks in advance.

/Søren

EDIT:

Simplified code:

<h:form>
  <ui:repeat ...>
     <h:inputText value="#{order.quantity}"/>
  </ui:repeat>
  <h:commandButton type="button" action="#{facade.updateOrderItems()}" value="Update">
     <f:ajax execute="@form" render=":orderList" onevent="onAjaxEvent"></f:ajax>
  </h:commandButton>
  <h:commandButton type="button" action="#{facade.deleteSelectedOrderItems(order)}" value="Delete">
    <f:ajax execute="@form" render=":orderList" onevent="onAjaxEvent"></f:ajax>
  </h:commandButton>
  <h:commandButton type="button" action="#{facade.addOrdersItemsToWishList(order)}" value="Add to wish list"> <f:ajax execute="@form" render=":orderList" onevent="onAjaxEvent"></f:ajax>
                                </h:commandButton>
</h:form>

When I click the Update button it seems the Delete and Add to wish list buttons gets called as well...?

Upvotes: 3

Views: 1191

Answers (1)

Daniel M&#252;ssig
Daniel M&#252;ssig

Reputation: 1602

I hope it's not to late. I had the same problem since two days ago and now solved it finaly. It turns out, that the problem is the type="button". So throwing this away is the workaround. In your f:ajax you have to use execute="@form" so that the valueChange-event is fired of the input-fields to have the data in the bean otherwise only the command-button is executed and the valueChange is not registered. So a button of yours should look like this:

<h:commandButton action="#{facade.deleteSelectedOrderItems(order)}" value="Delete">
   <f:ajax execute="@form" render=":orderList" onevent="onAjaxEvent"></f:ajax>
</h:commandButton>

Upvotes: 3

Related Questions