Komponenten sind mit der gleichen ID in ui: wiederholen

Question

Leider funktioniert primefaces accordionPanel nicht gut in Version 2.2.1, wenn Sie versuchen, Registerkarten dynamisch zu erstellen. Dies ist mein Fall, ich muss Akkordeons erstellen, wenn der Benutzer auf ein Hinzufügen-Symbol klickt, und entfernen, wenn er auf das X-Symbol klickt. Kein Problem, ich habe meine eigene Verbundkomponente erstellt, wie Sie hier sehen können:

<c:interface> 
    <c:attribute name="titulo" default="" required="false" /> 
    <c:attribute name="renderizar" default="true" required="false" /> 
    <c:attribute name="width" required="false" default="300"/> 
    <c:facet name="extra" required="false" /> 
</c:interface> 

<c:implementation> 
    <h:outputStylesheet library="css" name="hrgiAccordion.css" target="head" /> 
    <h:outputStylesheet library="css" name="clearfix.css" target="head" /> 
    <h:outputScript library="js" name="hrgiAccordion.js" target="head" /> 
    <h:panelGroup layout="block" rendered="#{cc.attrs.renderizar}" 
    styleClass="hrgi-accordion clearfix" style="width: #{cc.attrs.width}px;"> 
     <div class="hrgi-cabecalho-accordion clearfix" 
      onclick="abrirAccordion(this)"> 
      <h:outputLabel value="#{cc.attrs.titulo}" /> 
      <c:renderFacet name="extra" required="false"/> 
     </div> 
     <h:panelGroup layout="block" class="hrgi-conteudo-accordion clearfix"> 
      <c:insertChildren /> 
     </h:panelGroup> 
    </h:panelGroup> 
</c:implementation> 

Es funktioniert gut, aber ich habe einige Besonderheiten brauchen ... Der Inhalt Akkordeon Registerkarte einig auswählen und eine dynamische Tabelle mit einem input~~POS=TRUNC und einem Spinner (erstellt von mir wieder), können Sie die Benutzeroberfläche sehen hier:

Wenn Benutzer Einsatz Werte in Spinnereien, das Label „Total das parcelas“ sollten aktualisiert werden, aber es einfach aktualisiert, wenn der Dialog nur eine Akkordeon-Registerkarte enthält! Beim Generieren von HTML-Code habe ich gesehen, dass die Spinner in verschiedenen Akkordeon-Tabs gleich sind! Wahrscheinlich ist das der Grund, warum ich Werte nicht aktualisieren kann. Hier ist der Code dieses Dialogs:

<ui:composition template="../templates/popupSubmit.xhtml"> 
<ui:param name="titulo" value="#{vendaMsg['popup.forma_pagamento.titulo']}"/> 
<ui:param name="popup" value="#{modeloPopupFormaPagamento}"/> 
<ui:param name="controladorPopup" value="#{controladorPopupFormaPagamento}"/> 
<ui:define name="cabecalho"> 
    <h:panelGroup id="cabecalhoValores" binding="#{cabecalhoValores}" layout="block"> 
     <h:outputLabel value="#{vendaMsg['popup.forma_pagamento.total_prevenda']}" /> 
     <h:outputLabel value="#{preVendaBean.valorLiquido}"> 
      <f:convertNumber currencySymbol="R$" maxFractionDigits="2" 
          minFractionDigits="2" type="currency" currencyCode="BRL"/> 
     </h:outputLabel> 
     <hrgi:separador/> 
     <h:outputLabel value="#{vendaMsg['popup.forma_pagamento.total_parcelas']}" /> 
     <h:outputLabel value="#{controladorPopupFormaPagamento.calcularTotalParcelas()}"> 
      <f:convertNumber currencySymbol="R$" maxFractionDigits="2" 
          minFractionDigits="2" type="currency" currencyCode="BRL"/> 
     </h:outputLabel> 
    </h:panelGroup> 
</ui:define> 
<ui:define name="conteudo"> 
    <h:panelGroup layout="block" styleClass="clearfix hrgi-div-form"> 
     <h:panelGroup id="painelFormasDePagamento" binding="#{painelFormasDePagamento}" layout="block"> 
      <ui:repeat id="repeticao" var="formaPagamento" value="#{modeloPopupFormaPagamento.formasDePagamento}"> 
       <hrgi:accordion titulo="#{vendaMsg['popup.forma_pagamento.aba_acordeon.titulo']}" width="380"> 
        <f:facet name="extra"> 
         <p:commandLink action="#{controladorPopupFormaPagamento.removerForma(formaPagamento)}"           
             update=":#{painelFormasDePagamento.clientId}" global="false"> 
          <h:graphicImage library="img" name="remover.png"/> 
         </p:commandLink> 
        </f:facet> 
        <h:panelGroup layout="block" class="clearfix"> 
         <h:panelGroup id="painelSelecaoForma" layout="block"> 
          <h:outputLabel value="#{vendaMsg['popup.forma_pagamento.forma_pagamento']}"/> 
          <h:selectOneMenu value="#{formaPagamento.idFormaPagamento}"                 valueChangeListener="#{controladorPopupFormaPagamento.processarMudancaFormaPagamento}"> 
           <f:selectItems value="#{selectItemFormasPagamento.itens}"/> 
           <f:attribute value="#{formaPagamento}" name="formaPagamento"/> 
           <f:ajax event="change" render="painelSelecaoForma painelParcelasFormaPagamento" execute="painelSelecaoForma"/> 
          </h:selectOneMenu> 
          <h:outputLabel value="#{vendaMsg['popup.forma_pagamento.plano_pagamento']}"          /> 
          <h:selectOneMenu value="#{formaPagamento.idPlanoPagamento}"          valueChangeListener="#{controladorPopupFormaPagamento.processarMudancaPlanoPagamento}"> 
           <f:selectItems value="#{controladorPopupFormaPagamento.recuperarCarregador(formaPagamento).itens}"/> 
           <f:attribute value="#{formaPagamento}" name="formaPagamento"/> 
           <f:ajax event="change" render="painelParcelasFormaPagamento"/> 
          </h:selectOneMenu> 
         </h:panelGroup> 
         <h:panelGroup id="painelParcelasFormaPagamento" layout="block"> 
          <p:dataTable id="tabela" value="#{formaPagamento.parcelas}" var="parcela" 
             emptyMessage="#{msgGerais['gerais.sem_dados']}" 
             scrollable="#{formaPagamento.parcelas.size()>2}" 
             height="76"> 
           <p:column headerText="#{vendaMsg['popup.forma_pagamento.tabela.numero_parcela']}"> 
            <h:outputText value="#{formaPagamento.parcelas.indexOf(parcela)+1}"/> 
           </p:column> 
           <p:column headerText="#{vendaMsg['popup.forma_pagamento.tabela.vencimento_parcela']}"> 
            <hrgi:editableDate value="#{parcela.dataVencimento}" editable="true"/> 
           </p:column> 
           <p:column headerText="#{vendaMsg['popup.forma_pagamento.tabela.valor_parcela']}"> 
            <hrgi:spinner id="valor" 
              dinheiro="true" fator="0.01" local="pt-BR" 
              value="#{parcela.valor}"> 
             <f:ajax event="change" execute="@form" 
               render=":#{cabecalhoValores.clientId}"/> 
             <f:convertNumber currencySymbol="R$" maxFractionDigits="2" 
                 minFractionDigits="2" type="currency" currencyCode="BRL" 
                 for="input"/> 
            </hrgi:spinner> 
           </p:column> 
          </p:dataTable> 
         </h:panelGroup> 
        </h:panelGroup> 
       </hrgi:accordion> 
      </ui:repeat> 
     </h:panelGroup> 
     <p:commandLink immediate="true" action="#{controladorPopupFormaPagamento.adicionarForma}" 
         update="painelFormasDePagamento" global="false"> 
      <h:graphicImage library="img" name="adicionar_48.png"/> 
     </p:commandLink> 
    </h:panelGroup> 
</ui:define> 
</ui:composition> 

In diesem Bild kann man sehen, was geschieht, Komponente id innerhalb primefaces Datentabelle nicht mit ui angehängt: repeat Index:

Wie kann ich dieses Problem lösen ???

Answer 1

Dies ist ein Mojarra-Bug, der sich manifestiert, wenn Sie eine UIData Komponente in eine UIRepeat verschachteln. Ich habe es jemals als issue 1830 gemeldet. Es ist noch nicht so weit behoben und es funktioniert wie erwartet in MyFaces. Die UIRepeat ist in Mojarra in vielerlei Hinsicht gebrochen, funktioniert aber in MyFaces perfekt.

Wenn Sie an Mojarra bleiben wollen/müssen und es daher nicht durch MyFaces ersetzen können, sollten Sie die UIRepeat durch eine vollwertige Komponente UIData ersetzen. Tomahawk's<t:dataList> zum Beispiel erzeugt keine zusätzlichen Markup und ist ein guter <ui:repeat> Ersatz. Oder Sie könnten PrimeFaces <p:dataList> verwenden und die Listenaufzählungszeichen mit einigen CSS list-style-type: none ausblenden.

Update: Das gemeldete Problem wurde in Mojarra 2.1.12 und 2.2.0-m06 behoben. Also, wenn Sie können, nur auf mindestens diese Version aktualisieren.