3 Replies Latest reply on Sep 8, 2010 3:22 AM by ilya_shaikovsky

    Seam Ajax Pagination and reRender Attribute

    darran85

      Hi, i'm facing some problems with the seam pagination using EntityQuery classes. I want to create an ajax pagination, but it seems that the reRender attribute of the a4j:commandLink tags don't work always as expected.

      Here's my code

       

      <a4j:form id="form">
              <a4j:outputPanel id="dataTable" layout="block" >
              <rich:dataTable
                  value="#{businessProcessList.resultList}"
                  var="businessProcess"
                  onRowMouseOver="this.style.backgroundColor='#F1F1F1';"
                  onRowMouseOut="this.style.backgroundColor='#FFFFFF'"
                  >
                  <rich:column>
                      <f:facet name="header">
                          <s:decorate template="../layout/sort2.xhtml">
                              <ui:param name="entityList" value="#{businessProcessList}"/>
                              <ui:param name="propertyLabel" value="Id"/>
                              <ui:param name="propertyPath" value="businessProcess.id"/>
                          </s:decorate>
                      </f:facet>
                      <h:outputText value="#{businessProcess.id}" />
                  </rich:column>
                  <rich:column name="">
                      <f:facet name="header">Name</f:facet>
                      <h:outputText value="#{businessProcess.name}">
                      </h:outputText>
                  </rich:column>
              </rich:dataTable>
             
              <div
                  class="tableControl"
                  style="height: 1em">
              <a4j:commandLink
                  rendered="#{businessProcessList.previousExists}"
                  value="#{messages.left}#{messages.left} " reRender="dataTable"
                  >
                  <a4j:actionparam name="firstResult" value="0" assignTo="#{businessProcessList.firstResult}"/>
               
              </a4j:commandLink>
              <a4j:commandLink
                  rendered="#{businessProcessList.previousExists}"
                  value="#{messages.left} " reRender="dataTable">
                  <a4j:actionparam name="firstResult" value="#{businessProcessList.previousFirstResult}" assignTo="#{businessProcessList.firstResult}"/>
                 
              </a4j:commandLink>
              <a4j:commandLink
                  value="#{messages.right} "
                  rendered="#{businessProcessList.nextExists}" reRender="dataTable">
                  <a4j:actionparam name="firstResult" value="#{businessProcessList.nextFirstResult}" assignTo="#{businessProcessList.firstResult}"/>
                
              </a4j:commandLink>
              <a4j:commandLink
                  rendered="#{businessProcessList.nextExists}"
                  value=" #{messages.right}#{messages.right}" reRender="dataTable">
                  <a4j:actionparam name="firstResult" value="#{businessProcessList.lastFirstResult}" assignTo="#{businessProcessList.firstResult}"/>
               
              </a4j:commandLink>
              </div>
             
              </a4j:outputPanel>
             
              <a4j:log popup="false"></a4j:log>
              </a4j:form>

       

      If i click to the next Button, it works good and this is my log:

       

      debug[14:25:02,976]: Have  Event [object Object] with properties: target:  http://localhost:7001/cem-console/journaling/provaPaging.html#,  srcElement: undefined, type: click
      debug[14:25:02,977]: Query preparation for form 'form'  requested
      debug[14:25:02,979]:  Append hidden control form with value [form] and value attribute  [form]
      debug[14:25:02,980]: Append  hidden control autoScroll with value [] and value attribute []
      debug[14:25:02,981]: Append hidden  control javax.faces.ViewState with value [j_id3] and value attribute  [j_id3]
      debug[14:25:02,981]: parameter  firstResult with value 10
      debug[14:25:02,982]:  parameter form:j_id58 with value form:j_id58
      debug[14:25:02,983]: Look up queue with  default name
      debug[14:25:02,984]:  NEW AJAX REQUEST !!! with form: form
      debug[14:25:02,985]: Start  XmlHttpRequest
      debug[14:25:02,990]:  Request state : 1
      debug[14:25:02,993]:  QueryString:  AJAXREQUEST=_viewRoot&form=form&autoScroll=&javax.faces.ViewState=j_id3&firstResult=10&form%3Aj_id58=form%3Aj_id58&
      debug[14:25:02,999]: Request state : 1
      debug[14:25:04,609]: Request state : 2
      debug[14:25:04,611]: Request state : 3
      debug[14:25:04,612]: Request state : 3
      debug[14:25:04,613]: Request state : 4
      debug[14:25:04,613]: Request end with  state 4
      debug[14:25:04,613]: Response   with content-type: text/xml;charset=UTF-8
      debug[14:25:04,614]: Full response  content: <?xml version="1.0"?>  <html lang="it"  xmlns="http://www.w3.org/1999/xhtml"><head><title></title><link  class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/panel.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/toolBar.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><script  src="/cem-console/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript"  type="text/javascript">  </script><script  src="/cem-console/a4j/g/3_3_3.Finalorg/ajax4jsf/javascript/scripts/form.js"  type="text/javascript">  </script><link class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/table.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="user"  href="/cem-console/a4j/s/3_3_3.Finalstylesheet/theme.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="user"  href="/cem-console/stylesheet/theme.css" rel="stylesheet"  type="text/css" /><link class="user"  href="/cem-console/stylesheet/blitzer/skin.css" rel="stylesheet"  type="text/css" /></head><body><div  id="form:dataTable"><table class="rich-table" id="form:j_id43"  border="0" cellpadding="0" cellspacing="0"><colgroup  span="2"></colgroup><thead  class="rich-table-thead"><tr  class="rich-table-subheader"><th class="rich-table-subheadercell"  scope="col" id="form:j_id43:j_id44header"><div  id="form:j_id43:j_id44header:sortDiv"><div  id="form:j_id43:j_id45"><a  href="/cem-console/journaling/provaPaging.html?sort=businessProcess.id&amp;dir=asc&amp;cid=41"  id="form:j_id43:j_id45:j_id46"  class="columnHeader">Id</a></div></div></th><th  class="rich-table-subheadercell" scope="col"  id="form:j_id43:j_id50header"><div  id="form:j_id43:j_id50header:sortDiv">Name</div></th></tr></thead><tbody  id="form:j_id43:tb"><tr class="rich-table-row  rich-table-firstrow" onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:0:j_id44">16</td><td  class="rich-table-cell" id="form:j_id43:0:j_id50">Blocco per  accredito manuale</td></tr><tr class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:1:j_id44">17</td><td  class="rich-table-cell" id="form:j_id43:1:j_id50">Attivazione nuova  offerta</td></tr><tr class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:2:j_id44">18</td><td  class="rich-table-cell" id="form:j_id43:2:j_id50">Richiesta vendita  seriale</td></tr><tr class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:3:j_id44">19</td><td  class="rich-table-cell" id="form:j_id43:3:j_id50">Verifica IMEI  ricarica scratch</td></tr><tr class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:4:j_id44">20</td><td  class="rich-table-cell" id="form:j_id43:4:j_id50">Richiesta acquisto  carta servizi per GINO</td></tr><tr  class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:5:j_id44">27</td><td  class="rich-table-cell" id="form:j_id43:5:j_id50">Query OPSC per  blocco scratch generico</td></tr><tr  class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:6:j_id44">28</td><td  class="rich-table-cell" id="form:j_id43:6:j_id50">Query OPSC per  blocco scratch per furto dealer</td></tr><tr  class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:7:j_id44">29</td><td  class="rich-table-cell" id="form:j_id43:7:j_id50">Query OPSC per  blocco scratch per accredito manuale</td></tr><tr  class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:8:j_id44">30</td><td  class="rich-table-cell" id="form:j_id43:8:j_id50">Query OPSC per  blocco scratch per ricaricard scaduta</td></tr><tr  class="rich-table-row"  onmouseover="this.style.backgroundColor='#F1F1F1';"  onmouseout="this.style.backgroundColor='#FFFFFF'"><td  class="rich-table-cell" id="form:j_id43:9:j_id44">31</td><td  class="rich-table-cell" id="form:j_id43:9:j_id50">Query OPSC per  blocco scratch per anomalie  40916</td></tr></tbody></table><div  class="tableControl" style="height: 1em"><a href="#"  id="form:j_id54" name="form:j_id54"  onclick="A4J.AJAX.Submit('form',event,{'similarityGroupingId':'form:j_id54','parameters':{'firstResult':'0','form:j_id54':'form:j_id54'}  } );return false;">‹‹</a> <a href="#" id="form:j_id56"  name="form:j_id56"  onclick="A4J.AJAX.Submit('form',event,{'similarityGroupingId':'form:j_id56','parameters':{'firstResult':'0','form:j_id56':'form:j_id56'}  } );return false;">‹</a> <a href="#" id="form:j_id58"  name="form:j_id58"  onclick="A4J.AJAX.Submit('form',event,{'similarityGroupingId':'form:j_id58','parameters':{'firstResult':'20','form:j_id58':'form:j_id58'}  } );return false;">›</a> <a href="#" id="form:j_id60"  name="form:j_id60"  onclick="A4J.AJAX.Submit('form',event,{'similarityGroupingId':'form:j_id60','parameters':{'firstResult':'40','form:j_id60':'form:j_id60'}  } );return false;">››</a></div></div><meta  name="Ajax-Update-Ids" content="form:dataTable" /><span  id="ajax-view-state"><input type="hidden"  name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id3"  /></span><meta id="Ajax-Response" name="Ajax-Response"  content="true" /><meta name="Ajax-Update-Ids"  content="form:dataTable" /><span id="ajax-view-state"><input  type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState"  value="j_id3" /></span><meta id="Ajax-Response"  name="Ajax-Response" content="true" /></body></html>
      debug[14:25:04,616]: Header  Ajax-Expired not found, search in <meta>
      debug[14:25:04,617]: search for elements  by name 'meta'  in element #document
      debug[14:25:04,618]: Find <meta  name='Ajax-Update-Ids' content='form:dataTable'>
      debug[14:25:04,618]: Find <meta  name='Ajax-Response' content='true'>
      debug[14:25:04,619]: Find <meta  name='Ajax-Update-Ids' content='form:dataTable'>
      debug[14:25:04,619]: Find <meta  name='Ajax-Response' content='true'>
      debug[14:25:04,619]: Header Ajax-Update-Ids not found,  search in <meta>
      debug[14:25:04,620]:  search for elements by name 'meta'  in element #document
      debug[14:25:04,620]: Find <meta  name='Ajax-Update-Ids' content='form:dataTable'>
      debug[14:25:04,620]: Update page by list  of rendered areas from response form:dataTable
      debug[14:25:04,621]: search for elements  by name 'script'  in element #document
      debug[14:25:04,621]: <script> in response with  src=/cem-console/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript
      debug[14:25:04,622]: Such element exist  in document
      debug[14:25:04,622]:  <script> in response with  src=/cem-console/a4j/g/3_3_3.Finalorg/ajax4jsf/javascript/scripts/form.js
      debug[14:25:04,623]: Such element exist  in document
      debug[14:25:04,624]:  search for elements by name 'link'  in element #document
      debug[14:25:04,626]: <link> in  response with  src=/cem-console/a4j/s/3_3_3.Finalcss/panel.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__
      debug[14:25:04,626]: Such element exist  in document
      debug[14:25:04,627]:  <link> in response with  src=/cem-console/a4j/s/3_3_3.Finalcss/toolBar.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__
      debug[14:25:04,628]: Such element exist  in document
      debug[14:25:04,628]:  <link> in response with  src=/cem-console/a4j/s/3_3_3.Finalcss/table.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__
      debug[14:25:04,629]: Such element exist  in document
      debug[14:25:04,629]:  <link> in response with  src=/cem-console/a4j/s/3_3_3.Finalstylesheet/theme.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__
      debug[14:25:04,630]: Such element exist  in document
      debug[14:25:04,630]:  <link> in response with  src=/cem-console/stylesheet/theme.css
      debug[14:25:04,631]: Such element exist in document
      debug[14:25:04,631]: <link> in  response with src=/cem-console/stylesheet/blitzer/skin.css
      debug[14:25:04,632]: Such element exist  in document
      debug[14:25:04,632]:  call getElementById for id= org.ajax4jsf.queue_script
      debug[14:25:04,632]: Update page part  from call parameter for ID form:dataTable
      debug[14:25:04,633]: call getElementById for id=  form:dataTable
      debug[14:25:04,637]:  Replace content of node by replaceChild()
      debug[14:25:04,640]: search for elements  by name 'script'  in element div
      debug[14:25:04,641]: Scripts in updated part count : 0
      debug[14:25:04,641]: call  getElementById for id= org.ajax4jsf.oncomplete
      debug[14:25:04,641]: Processing updates  finished, no oncomplete function to call
      debug[14:25:04,641]: Update part of page for Id:  form:dataTable successful
      debug[14:25:04,642]:  call getElementById for id= ajax-view-state
      debug[14:25:04,642]: Hidden JSF state  fields: [object HTMLSpanElement]
      debug[14:25:04,642]: Namespace for hidden view-state  input fields is undefined
      debug[14:25:04,642]:  search for elements by name 'input'  in element span
      debug[14:25:04,643]: Replace value for  inputs: 5 by new values: 1
      debug[14:25:04,643]:  Input in response: javax.faces.ViewState
      debug[14:25:04,643]: Found same input on  page with type: hidden
      debug[14:25:04,643]:  Found same input on page with type: hidden
      debug[14:25:04,644]: search for elements  by name 'INPUT'  in element span
      debug[14:25:04,644]: Replace value for inputs: 5 by  new values: 0
      debug[14:25:04,644]:  call getElementById for id= _A4J.AJAX.focus
      debug[14:25:04,644]: No focus  information in response

       

       

      But if i click on the other links, it doesn't work as a4j is not rerendering my output panel. Here's my log:

       

      debug[14:26:03,459]: Have  Event [object Object] with properties: target:  http://localhost:7001/cem-console/journaling/provaPaging.html#,  srcElement: undefined, type: click
      debug[14:26:03,459]: Query preparation for form 'form'  requested
      debug[14:26:03,461]:  Append hidden control form with value [form] and value attribute  [form]
      debug[14:26:03,462]: Append  hidden control autoScroll with value [] and value attribute []
      debug[14:26:03,463]: Append hidden  control javax.faces.ViewState with value [j_id3] and value attribute  [j_id3]
      debug[14:26:03,463]: parameter  firstResult with value 0
      debug[14:26:03,464]:  parameter form:j_id54 with value form:j_id54
      debug[14:26:03,465]: Look up queue with  default name
      debug[14:26:03,466]:  NEW AJAX REQUEST !!! with form: form
      debug[14:26:03,466]: Start  XmlHttpRequest
      debug[14:26:03,472]:  Request state : 1
      debug[14:26:03,474]:  QueryString:  AJAXREQUEST=_viewRoot&form=form&autoScroll=&javax.faces.ViewState=j_id3&firstResult=0&form%3Aj_id54=form%3Aj_id54&
      debug[14:26:03,481]: Request state : 1
      debug[14:26:05,010]: Request state : 2
      debug[14:26:05,011]: Request state : 3
      debug[14:26:05,012]: Request state : 4
      debug[14:26:05,012]: Request end with  state 4
      debug[14:26:05,012]: Response   with content-type: text/xml;charset=UTF-8
      debug[14:26:05,012]: Full response  content: <?xml version="1.0"?>  <html lang="it"  xmlns="http://www.w3.org/1999/xhtml"><head><title></title><link  class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/panel.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/toolBar.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><script  src="/cem-console/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript"  type="text/javascript">  </script><script  src="/cem-console/a4j/g/3_3_3.Finalorg/ajax4jsf/javascript/scripts/form.js"  type="text/javascript">  </script><link class="component"  href="/cem-console/a4j/s/3_3_3.Finalcss/table.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="user"  href="/cem-console/a4j/s/3_3_3.Finalstylesheet/theme.xcss/DATB/eAE7GqBiErp8hjQADtADHQ__"  rel="stylesheet" type="text/css" /><link class="user"  href="/cem-console/stylesheet/theme.css" rel="stylesheet"  type="text/css" /><link class="user"  href="/cem-console/stylesheet/blitzer/skin.css" rel="stylesheet"  type="text/css" /></head><body><meta  name="Ajax-Update-Ids" content="" /><span  id="ajax-view-state"><input type="hidden"  name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id3"  /></span><meta id="Ajax-Response" name="Ajax-Response"  content="true" /><meta name="Ajax-Update-Ids" content=""  /><span id="ajax-view-state"><input type="hidden"  name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id3"  /></span><meta id="Ajax-Response" name="Ajax-Response"  content="true" /></body></html>
      debug[14:26:05,013]: Header Ajax-Expired  not found, search in <meta>
      debug[14:26:05,013]: search for elements by name  'meta'  in element #document
      debug[14:26:05,013]:  Find <meta name='Ajax-Update-Ids' content=''>
      debug[14:26:05,013]: Find <meta  name='Ajax-Response' content='true'>
      debug[14:26:05,014]: Find <meta  name='Ajax-Update-Ids' content=''>
      debug[14:26:05,014]: Find <meta  name='Ajax-Response' content='true'>
      debug[14:26:05,014]: Header Ajax-Update-Ids not found,  search in <meta>
      debug[14:26:05,014]:  search for elements by name 'meta'  in element #document
      debug[14:26:05,014]: Find <meta  name='Ajax-Update-Ids' content=''>
      warn[14:26:05,015]: No information in response about  elements to replace
      debug[14:26:05,015]:  call getElementById for id= org.ajax4jsf.oncomplete
      debug[14:26:05,015]: Processing updates  finished, no oncomplete function to call
      debug[14:26:05,015]: call getElementById for id=  ajax-view-state
      debug[14:26:05,016]:  Hidden JSF state fields: [object HTMLSpanElement]
      debug[14:26:05,016]: Namespace for  hidden view-state input fields is undefined
      debug[14:26:05,016]: search for elements  by name 'input'  in element span
      debug[14:26:05,016]: Replace value for inputs: 5 by  new values: 1
      debug[14:26:05,017]:  Input in response: javax.faces.ViewState
      debug[14:26:05,017]: Found same input on  page with type: hidden
      debug[14:26:05,017]:  Found same input on page with type: hidden
      debug[14:26:05,017]: search for elements  by name 'INPUT'  in element span
      debug[14:26:05,018]: Replace value for inputs: 5 by  new values: 0
      debug[14:26:05,018]:  call getElementById for id= _A4J.AJAX.focus
      debug[14:26:05,018]: No focus  information in response
      It works fine if I put the ajaxRendered attribute on my a4joutput panel, but i don't want to do that because this is a simple example but i want to incorporate it into complex pages with many ajax and i don't want the panel to be rendered always at every ajax request. I don't want even to use rich:datascroller because i have a great amount of data on my  database and we prefer to do single query for pagination as seam allows to do with the Entity Query classes. The pagination works fine if I don't use ajax but simple jsf commandLinks. With a4j:commandButton the beahvior it's the same(it doesn't work).
      Thanks for helping me.