6 Replies Latest reply on Oct 13, 2011 11:16 AM by edilmar

    RF4 rich:extendedDataTable error rendering

    edilmar

      Hi,

       

       

      My environment is: NetBeans7 + GlassFish3.1 + Weld/CDI1.1 + Mojarra/JSF2.1 + RichFaces4.0.0Final + Firefox4.

       

      When using rich:extendedDataTable, there is a problem. First of all, the rendering works fine:

      extendedDataTableBeforeError.jpeg

      Then, the user types a code "CTRC" in the inputText at top of the page and clicks "Inserir", to locate and move a row from left table to right table, like this:

      extendedDataTableFilteringBeforeError.jpeg

      After the click event to process in the server and to return null, to become in the same page, the tables become like this:

      extendedDataTableAfterError.jpeg

      The console of JS errors from Firefox arises this error:

      Erro: RichFaces.ui.ExtendedDataTable is not a constructor

      Source file: http://localhost:8080/sitesat2/faturaVinculacaoConhec.jsf?cid=2

      Line: 55

      This line has the following HTML code generated:

       

      <td colspan="3"><div id="formCad:tableNestaFatura" class="rf-edt" style="height:450px; width:530px;"><style type="text/css">div.rf-edt-cnt { width: 100%; }.rf-edt-c-numConhec {width: 55px;}.rf-edt-c-numNF {width: 55px;}.rf-edt-c-pedidoCliente2 {width: 55px;}.rf-edt-c-dataEmissao {width: 75px;}.rf-edt-c-cartaFrete {width: 55px;}.rf-edt-c-pesoChegada {width: 70px;}.rf-edt-c-valorCalcNestaFatura {width: 70px;}.rf-edt-c-placaVeiculo {width: 80px;}</style><div class="rf-edt-hdr"><table cellpadding="0" cellspacing="0"><tbody><tr><td><div id="formCad:tableNestaFatura:header" class="rf-edt-cnt"><table id="formCad:tableNestaFatura:cfhn" cellpadding="0" cellspacing="0"><tbody><tr><td><div class="rf-edt-rsz-cntr rf-edt-c-numConhec"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-numConhec"><div class="rf-edt-hdr-c-cnt"><span class="headerText">CTRC</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-numNF"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-numNF"><div class="rf-edt-hdr-c-cnt"><span class="headerText">NF</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-pedidoCliente2"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-pedidoCliente2"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Load</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-dataEmissao"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-dataEmissao"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Data Emissão</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-cartaFrete"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-cartaFrete"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Carta Frete</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-pesoChegada"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-pesoChegada"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Peso Chegada</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-valorCalcNestaFatura"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-valorCalcNestaFatura"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Valor</span></div></div></td><td><div class="rf-edt-rsz-cntr rf-edt-c-placaVeiculo"><div class="rf-edt-rsz"></div></div><div class="rf-edt-hdr-c rf-edt-c-placaVeiculo"><div class="rf-edt-hdr-c-cnt"><span class="headerText">Veículo</span></div></div></td></tr></tbody></table></div></td></tr></tbody></table></div><div id="formCad:tableNestaFatura:b" class="rf-edt-b"><div><div class="rf-edt-spcr"></div><table cellpadding="0" cellspacing="0"><tbody><tr><td><div id="formCad:tableNestaFatura:body" class="rf-edt-cnt"><table id="formCad:tableNestaFatura:tbtn" cellpadding="0" cellspacing="0"><tbody id="formCad:tableNestaFatura:tbn"><tr id="formCad:tableNestaFatura:0:n"><td class="alignCenter"><div class="rf-edt-c rf-edt-c-numConhec"><div class="rf-edt-c-cnt">12345</div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-numNF"><div class="rf-edt-c-cnt"></div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-pedidoCliente2"><div class="rf-edt-c-cnt"></div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-dataEmissao"><div class="rf-edt-c-cnt">08/06/2011</div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-cartaFrete"><div class="rf-edt-c-cnt"></div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-pesoChegada"><div class="rf-edt-c-cnt"></div></div></td><td class="alignRight"><div class="rf-edt-c rf-edt-c-valorCalcNestaFatura"><div class="rf-edt-c-cnt">3.000,00</div></div></td><td class="alignLeft"><div class="rf-edt-c rf-edt-c-placaVeiculo"><div class="rf-edt-c-cnt">CLJ-0250</div></div></td></tr><tr id="formCad:tableNestaFatura:1:n"><td class="alignCenter"><div class="rf-edt-c rf-edt-c-numConhec"><div class="rf-edt-c-cnt">111111</div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-numNF"><div class="rf-edt-c-cnt">2310</div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-pedidoCliente2"><div class="rf-edt-c-cnt"></div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-dataEmissao"><div class="rf-edt-c-cnt">10/06/2011</div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-cartaFrete"><div class="rf-edt-c-cnt"></div></div></td><td class="alignCenter"><div class="rf-edt-c rf-edt-c-pesoChegada"><div class="rf-edt-c-cnt"></div></div></td><td class="alignRight"><div class="rf-edt-c rf-edt-c-valorCalcNestaFatura"><div class="rf-edt-c-cnt">100,00</div></div></td><td class="alignLeft"><div class="rf-edt-c rf-edt-c-placaVeiculo"><div class="rf-edt-c-cnt">AAC-2588</div></div></td></tr></tbody></table></div></td></tr></tbody></table></div></div><div class="rf-edt-ftr"><table cellpadding="0" cellspacing="0"><tbody><tr><td><div id="formCad:tableNestaFatura:footer" class="rf-edt-cnt rf-edt-ftr-cnt"><table id="formCad:tableNestaFatura:cffn" cellpadding="0" cellspacing="0"><tbody><tr><td><div class="rf-edt-ftr-c-emp rf-edt-c-numConhec"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-numNF"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-pedidoCliente2"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-dataEmissao"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-cartaFrete"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-pesoChegada"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-valorCalcNestaFatura"></div></td><td><div class="rf-edt-ftr-c-emp rf-edt-c-placaVeiculo"></div></td></tr></tbody></table></div></td></tr></tbody></table></div><table id="formCad:tableNestaFatura:r" class="rf-edt-rord" cellpadding="0" cellspacing="0"><tr><th>&#160;</th></tr><tr><td>&#160;</td></tr><tr><td>&#160;</td></tr><tr><td>&#160;</td></tr><tr><td>&#160;</td></tr><tr><td>&#160;</td></tr><tr><td>&#160;</td></tr></table><div id="formCad:tableNestaFatura:d" class="rf-edt-rsz-mkr"></div><div id="formCad:tableNestaFatura:rm" class="rf-edt-rord-mkr"></div><input id="formCad:tableNestaFatura:wi" name="formCad:tableNestaFatura:wi" type="hidden" /><input id="formCad:tableNestaFatura:si" name="formCad:tableNestaFatura:si" type="hidden" value="|||" /><script type="text/javascript">new RichFaces.ui.ExtendedDataTable('formCad:tableNestaFatura', 2, function(event, clientParams) {RichFaces.ajax("formCad:tableNestaFatura",event,{"clientParameters":clientParams,"incId":"1"} );},{"selectionMode":"multipleKeyboardFree"} );</script></div>

       

      The code for button Inserir and for tables is below:

       

          <h:inputText id="campoFiltro" value="#{faturaVinculacaoConhec.campoFiltro}" size="10" maxlength="10"/>
          <a4j:commandButton value="Inserir" onclick="focus(campoFiltro);" status="botoesStatus"
                             action="#{faturaVinculacaoConhec.inserirPorFiltro}"
                             execute="tipoFiltro,campoFiltro,tableSemFatura"
                             render="messages,campoFiltro,ctSemFatura,ctNestaFatura,tableSemFatura,tableNestaFatura">
          </a4j:commandButton>

       

                <rich:extendedDataTable id="tableSemFatura"
                                        var="item" rowKeyVar="rowListTableSemFatura"
                                        value="#{faturaVinculacaoConhec.listTableSemFatura}"
                                        style="height:450px; width:530px;"
                                        binding="#{faturaVinculacaoConhec.dataTableSemFatura}"
                                        selectionMode="multipleKeyboardFree"
                                        selection="#{faturaVinculacaoConhec.selecTableSemFatura}"
                                        >

       

      ... rest of the data table code with columns...
        • 1. Re: RF4 rich:extendedDataTable error rendering
          edilmar

          The strange is that if I use left/right arrow buttons to move rows from left to right and to return from right to left, all works fine.

          Here is one of the buttons:

           

                    <a4j:commandButton value="&#160;&gt;&#160;" status="botoesStatus"
                                       action="#{faturaVinculacaoConhec.inserirAlguns}"
                                       execute="tipoFiltro,campoFiltro,tableSemFatura"
                                       render="messages,campoFiltro,ctSemFatura,ctNestaFatura,tableSemFatura,tableNestaFatura">
                    </a4j:commandButton>

           

          I dont know what's the difference between JSF codes of "Inserir button" and "> button".

          The Java codes are almost equals => "Inserir" calls inserirPorFiltro (to locate the row before move) and ">" call inserirAlguns (that receives the rows selected to move). But both return null, to becomes in the same page.

          • 2. Re: RF4 rich:extendedDataTable error rendering
            edilmar

            I did other test putting a normal rich:dataTable with the same columns of the left extendedDataTable.

            There is no problem rendering this table.

            • 3. Re: RF4 rich:extendedDataTable error rendering
              edilmar

              I tested now with Firefox6 and Chrome14, and the same problem continues. I registered a bug in JIRA... https://issues.jboss.org/browse/RF-11419

              • 4. Re: RF4 rich:extendedDataTable error rendering
                edilmar

                The bug occurs when using binding property. I have two extendedDataTable's in the same form.

                If I comment out the binding property from one of the tables, no problems with rendering occurs.

                Is there some limitation to have two or more extendedDataTable's in the same form with binding property configured?

                The RF constructor for the table becomes crazy in the second time the page is showed, I think it doesn't know about creating more than one table.

                • 5. Re: RF4 rich:extendedDataTable error rendering
                  bleathem

                  To summarize:

                  ExtendedDataTables don't rerender when you navigate back to the page, in the case where you have two extendedDataables present, and those extendedDataables use the binding property.  When you do not use the binding property, then the rendering works correctly.

                   

                  Is it safe to assume you are not binding the two table to the same instance?

                  • 6. Re: RF4 rich:extendedDataTable error rendering
                    edilmar

                    I have two variables for binding. And using binding with just one table, commenting the other, the same problem occurs. I solved this in other way, not using binding anymore.