jsf - How to ajax update an item in the footer of a PrimeFaces dataTable? -


this visual of table have:

 +---------+------------+-------------------+ | header1 |  header2   | header3           | +---------+------------+-------------------+ | row   |  input   | calc'ed output  | | row b   |  input b   | calc'ed output b  | | etc..   |  etc..     |  etc..            | +---------+------------+-------------------+ |    total:          total calc'ed output  | +------------------------------------------+ 

and stripped-down code:

<p:datatable id="mytable" value="#{mybean.somelist}"     var="currentitem">      <p:column headertext="header1">         <h:outputtext value="#{currentitem.name}" />     </p:column>      <p:column headertext="header2">         <pe:inputnumber value="#{currentitem.inputval}">             <p:ajax event="change" listener="#{mybean.changelistener}"                 update="outputval outputtotal" />         </pe:inputnumber>     </p:column>      <p:column headertext="header3">         <h:outputtext id="outputval" value="#{currentitem.outputval}" />     </p:column>      <f:facet name="footer">         total:         <h:outputtext id="outputtotal" value="#{mybean.total}" />     </f:facet>  </p:datatable> 

the mybean.somelist arraylist<someotherbean> 1 string , 2 integers, getters , setters. mybean.changelistener calculates second integer first given row, , total rows.

so, when type in 1 of inputs focus out, listener called , calculation done, on screen, value in third column changes, total stubbornly remains zero. i'm sure has primefaces appending row index generated id's of each input , output, can't figure out how output in footer (whose generated id mainform:mytable:0:outputtotal).

now, update parent table. whenever input receive focus part of update target, focus lost, , under extremely strict accessibility rules table must keyboard friendly (type number, tab, type number, tab, etc...)

i have tried:

  • update=":outputtotal" (gave exception cannot find component identifier...)
  • update="mytable:0:outputtota (same exception)
  • update="mytable:outputtotal" (no update, total stays zero)
  • wrap text in panelgroup , update (no update)

(primefaces 3.5.0 myfaces unknown version)

you can't update values of table within table. however, can use p:remotecommand achieve this. also, use celledit event on whole table (instead of single p:ajax on pe:inputnumber). overall result be:

<p:remotecommand name="refreshfooter" update=":formname:outputtotal"/> ... <p:datatable id="mytable" value="#{mybean.somelist}" var="currentitem">      <p:column headertext="header1">         <h:outputtext value="#{currentitem.name}" />     </p:column>      <p:column headertext="header2">         <pe:inputnumber value="#{currentitem.inputval}">             <p:ajax event="change" listener="#{mybean.changelistener}" process="@this"                 oncomplete="refreshfooter();" update="outputval"/>         </pe:inputnumber>     </p:column>      <p:column headertext="header3">         <h:outputtext id="outputval" value="#{currentitem.outputval}" />     </p:column>      <f:facet name="footer">         total:         <h:outputtext id="outputtotal" value="#{mybean.total}" />     </f:facet>  </p:datatable> 

please note might need add partialsubmit="true" p:ajax, way submit component's data. if celledit event idea, need make datatable editable, , add following in p:datatable, , rid of p:ajax inside pe:inputnumber

<p:ajax event="celledit" partialsubmit="true" listener="#{mybean.oncelledit}"      process="@this" oncomplete="refreshfooter();"/> 

good luck!


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -