Lepo Lepo - 3 months ago 18
Ajax Question

Update just on Tab of acordion Primefaces

I have an accordion with a dynamic number of tabs. The tab title get set to an css class. This makes the background ether green or red, depends on if all the articles in the order are delivered.

For every Article there is a selectBooleanButton and on every change of these Buttons the actual tab should get updated.

The problem is: How can I update just one tab? When i update the whole accordion the first tab opens and the other get closed.

<p:accordionPanel id="ordersAccordion" cache="true" value="#{ordersBean.orders}" var="order">
<p:tab
titleStyleClass="#{ordersBean.isOrderDelivered(order) ? 'ui-accordion-tab-delivered' : 'ui-accordion-tab-undelivered'}"
title="##{order.order_id} | #{order.printableOrderDate} | #{order.printableOrderTime} | #{order.user} | #{order.getDestination().toString()}">
<p:dataTable value="#{order.demands}" var="demand">
<p:column headerText="Artikel Nr.">
<p:outputLabel value="#{demand.article.articleNumber}" />
</p:column>
<p:column headerText="Name">
<p:outputLabel value="#{demand.article.name}" />
</p:column>
<p:column headerText="Beschreibung">
<p:outputLabel value="#{demand.article.description}" />
</p:column>
<p:column headerText="Haus">
<p:outputLabel value="#{demand.house.getLabel()}" />
</p:column>
<p:column headerText="Anzahl">
<p:outputLabel value="#{demand.quantity}" />
</p:column>
<p:column headerText="Mitarbeiter">
<p:outputLabel value="#{demand.employee}" />
</p:column>
<p:column headerText="Lieferstand" width="150" style="text-align: center">
<p:selectBooleanButton id="deliverdBtn" value="#{demand.delivered}" onLabel="Geliefert" offLabel="Geliefert" onIcon="ui-icon-check"
offIcon="ui-icon-close">
<p:ajax listener="#{ordersBean.saveDelivered(demand)}" update=":allOrders:ordersAccordion" />
</p:selectBooleanButton>
</p:column>
</p:dataTable>
</p:tab>
</p:accordionPanel>


Thanks for help

Answer

The AccordionPanel has an activeIndex attribute which you can use to work on the current tab. You should be able to do something like this:

<p:ajax listener="#{ordersBean.saveDelivered(demand)}" update=":allOrder:ordersAccordion:tab#{ordersAccordion.activeIndex}" />
Comments