How update just specific cell in primefaces dataTa

2019-01-20 08:59发布

问题:

I'm creating a dynamic datatable full of input fields. Sometimes when user insert values in some inputs, an specific cell should be updated, and only this cell. I thought it could be simple, but yet didn't make it work. The cell I want update is "valor total", this cell should be updated when the value of two others cell change:

EDITED

I've tryied f:ajax with complete id and got "Component with id:lancamentoNF:popupLancamentoNF:tabelaItensNF:0:valorTotalItem not found". Changed to p:ajax and no errors happen but it doesn't update!!

<h:panelGroup id="painelItensNF" layout="block" styleClass="hrgi-div-form aba-lancamento-nf clearfix" style="overflow:auto;">
    <h:panelGroup layout="block" style="width: 1700px;">
        <p:dataTable id="tabelaItensNF" value="#{modeloTabelaDinamicaItemNF.itens}" var="itemEmbrulhado" styleClass="tabelaDinamica" height="174" style="width: 100%;" rowIndexVar="indice">
            ... (some columns)
            <p:column style="width: 5%"
                      headerText="quantidade">
                <hrgi:spinner id="quantidadeItem"
                              value="#{itemEmbrulhado.item.produto.detalheTributavel.quantidade}"
                              dinheiro="false"
                              fator="#{itemEmbrulhado.item.produto.detalheTributavel.unidadeFracionada?0.01:1}"
                              local="pt-BR" min="0.00" width="70">
                    <p:ajax event="change"
                            update="lancamentoNF:popupLancamentoNF:tabelaItensNF:#{indice}:valorTotalItem"
                            listener="#{controladorPopupLancamentoNF.calcularValorTotalItem(itemEmbrulhado)}" global="false" />
                    <f:convertNumber
                            maxFractionDigits="#{itemEmbrulhado.item.produto.detalheTributavel.unidadeFracionada?2:0}"
                            minFractionDigits="#{itemEmbrulhado.item.produto.detalheTributavel.unidadeFracionada?2:0}"
                            locale="pt-BR"
                            for="quantidadeItem"/>
                </hrgi:spinner>
            </p:column>
            <p:column style="width: 5%"
                      headerText="valor unitario">
                <hrgi:spinner id="valorUnitarioItem"
                              value="#{itemEmbrulhado.item.produto.detalheTributavel.valorUnitario}"
                              dinheiro="true" fator="0.01" local="pt-BR" min="0.00" width="70">
                    <p:ajax event="change" 
                            update="lancamentoNF:popupLancamentoNF:tabelaItensNF:#{indice}:valorTotalItem"
                            listener="#{controladorPopupLancamentoNF.calcularValorTotalItem(itemEmbrulhado)}" global="false"/>
                    <f:convertNumber type="currency" currencyCode="BRL" currencySymbol="R$ "
                                     maxFractionDigits="10" minFractionDigits="2" locale="#{cc.attrs.local}"
                                     for="valorUnitarioItem"/>
                </hrgi:spinner>
            </p:column>
            <p:column style="width: 3%"
                      headerText="valor total">
                <h:outputText id="valorTotalItem" value="#{itemEmbrulhado.item.produto.valorTotal}">
                    <f:convertNumber type="currency" currencyCode="BRL" currencySymbol="R$ "
                                     maxFractionDigits="2" minFractionDigits="2" locale="pt-BR"
                                     for="valorUnitarioItem"/>
                </h:outputText>
            </p:column>
            ... (more columns)
        </p:dataTable>
    </h:panelGroup>
</h:panelGroup>

It works when I update the panelGroup "painelItensNF" with complete id, but the focus is lost and user should find the input he was working to continue...

回答1:

Just use update="valorTotalItem". It's relative to the current row already.

So, replace

<p:ajax ... update="lancamentoNF:popupLancamentoNF:tabelaItensNF:#{indice}:valorTotalItem" />

by

<p:ajax ... update="valorTotalItem" />


回答2:

I don't think it's possible to update a single cell. It's id is autogenerated, so you can't update this component by id.
You can try switching to primefaces 3.3 (not final release yet, but you can start working with the snapshot), and try if you can do what you want using primefaces selectors: http://www.primefaces.org/showcase-labs/ui/selectors.jsf
you'll have more changes with that, but I'm not sure if you'll be able to do it.

Or, you could update the panel and add some javascript to set the focus to the appropiate component. execute the javascript in the "oncomplete" method of the p:ajax component.

EDIT: Remove the index from the update, so it looks like this: ":lancamentoNF:popupLancamentoNF:tabelaItensNF:valorTotalItem" And of course BalusC is right, you may also just use "valorTotalItem"