3

動的な数のタブを持つアコーディオンがあります。タブのタイトルは CSS クラスに設定されます。これにより、注文のすべての商品が配達されたかどうかに応じて、背景が緑または赤になります。

すべての記事には selectBooleanButton があり、これらのボタンが変更されるたびに、実際のタブが更新されます。

問題は、1 つのタブだけを更新するにはどうすればよいかということです。アコーディオン全体を更新すると、最初のタブが開き、もう一方のタブが閉じます。

<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>
4

1 に答える 1

1

AccordionPanel には、現在のタブで作業するために使用できる activeIndex 属性があります。次のようなことができるはずです。

<p:ajax listener="#{ordersBean.saveDelivered(demand)}" update=":allOrder:ordersAccordion:tab#{ordersAccordion.activeIndex}" />
于 2013-07-25T13:20:00.137 に答える