11 Replies Latest reply on May 28, 2010 6:41 AM by Philip Murphy

    [RichFaces] Render component outside a region

    karl Estop Newbie

      Hello guys,

      I am trying to find out how to rerender a component located outside from a region:

       

          <a4j:region id="someUniqueRegionId" renderRegionOnly="true">
                       <h:inputText id="nameId" style="margin:0px;" size="10" value="#{bean.form.name}"
                          required="true">
                           <a4j:support event="onblur" reRender="idUnique" />
                      </h:inputText>
                      <rich:message for="nameId" errorClass="error" />
           </a4j:region>

         <a4j:region id="someUniqueRegionId2" renderRegionOnly="true">
                       <h:inputText id="lastnameId" style="margin:0px;" size="10" value="#{bean.form.lastname}"
                           required="true">
                           <a4j:support event="onblur"  />
                       </h:inputText>
                       <rich:message for="
      lastnameId" errorClass="error" />
           </a4j:region>


          <a4j:outputPanel id="idUnique">
                  Some text here
          </a4j:outputPanel>

       

      What I am trying to to is to rerender to last bit. Unfortunally i can put the last bit in any regions.

      If you could help me with i would be nice.I thank you in advance.

        • 1. Re: [RichFaces] Render component outside a region
          Travers Naran Newbie
          try reRender=":idUnique" (the ':' is important)
          • 2. Re: [RichFaces] Render component outside a region
            karl Estop Newbie

            Thank you for your answer, unfortunally reRender=":idUnique" is not working. Are they any other workaround that I can try ?

             

            Another details that I should maybe add , the last bit contains a nested component :

              <a4j:outputPanel id="idUnique">
                       <h:commandButton id="#saveButtonId" value="Save"
                                                    action="#{bean.save}"  disabled="#{not bean.valide}">                       
                       </h:commandButton>
                </a4j:outputPanel>

             

            I am trying to enable the button once all fields have been validated.Each time a I fill up a field I update the "valide" attribut

            in the bean.

            • 3. Re: [RichFaces] Render component outside a region
              Ilya Shaikovsky Master
              renderRegionOnly="true"means that nothing outside of region will be encoded.
              • 4. Re: [RichFaces] Render component outside a region
                karl Estop Newbie

                Yes , I clearly understand this point. The things is , I need to find a way to reRender a component that is outside a region even if the "renderRegionOnly" is set to true.Is it possible to reference a component that is outside a region without displaying it inside the region ?

                 

                The use case I am trying to implement is :

                     - You have a series of fields that need to be validated one by one. Each field is located in a region with renderRegionOnly=true, in order to only           process this field only at a time.

                     - Once all fields are validated, enable a bouton.

                • 5. Re: [RichFaces] Render component outside a region
                  Ilya Shaikovsky Master
                  just use ajaxSingle (also limittolist and process if need) attributes instead of region component. Then it could be achieved.
                  • 6. Re: [RichFaces] Render component outside a region
                    karl Estop Newbie
                    I will check it out thank you.
                    • 7. Re: [RichFaces] Render component outside a region
                      Philip Murphy Newbie

                      Hi Karl,

                       

                      Did you figure this out as I have the exact same problem? Using process or limitToList does not help.

                       

                      Thanks,

                       

                      Philip

                      • 8. Re: [RichFaces] Render component outside a region
                        Ilya Shaikovsky Master
                        It would be better to show the code you tried and explain which concrete problems appeared using it. "The same" problems often appears to be not exactly the same
                        • 9. Re: [RichFaces] Render component outside a region
                          Philip Murphy Newbie
                          Find snippet of code below...note that the structure is a rich tabPanel in one file that includes another file that contains the actual tab which contains a rich table that includes the repeating field to be validated. If validation fails then a message in the testMessages output panel is displayed.

                           

                           

                          If I surround the <s:decorate> with a <a4j:region renderRegionOnly="true">  then the validation works but the footer "testFooter" is not re-rendered. If I don't surround the <s:decorate> with an a4j:region then the validation doesn't work (after the first validation error**), but the footer is re-rendered.

                           

                           

                          ** Note, that the validation message is displayed on the first validation error but not on subsequent validation errors. That is, it is displayed for the first cell in the table that has a validation error, but if I select another cell in the same column that has a validation message the error message is not displayed. However, the validation message is displayed in the console always:

                           

                          sourceId=testTable:3:testDecorate:testValue[severity=(ERROR 2), summary=(Decimal Format Error), detail=(The value supplied was not in the correct format)]

                           

                           

                          <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                           

                           

                              <a4j:outputPanel id="testOutputPanel">
                                   <a4j:form id="testForm" prependId="false">
                                        <a4j:region selfRendered="true">
                                             <h:panelGroup id="testPanelGroup">
                                                  <rich:panel id="testPanel">
                                                        <h:panelGrid id="testPanelGrid">
                                                              <rich:tabPanel id="testTabPanel" switchType="client">
                                                                      <ui:include src="testTabPanel.xhtml" />
                                                                </rich:tabPanel>
                                                       </h:panelGrid>
                                                 </rich:panel>
                                              </h:panelGroup>
                                              <s:div />
                                              <a4j:outputPanel id="testMessages">
                                                   <h:message for="testOutputPanel" class="errors" showSummary="true" showDetail="true" />
                                               </a4j:outputPanel>
                                          </a4j:region>
                                       </a4j:form>
                              </a4j:outputPanel>
                          </ui:composition>

                           

                           

                          testTabPanel.xhtml

                           

                           

                          <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                           

                              <rich:tab label="Test" name="Test" >
                                    <rich:dataTable id="testTable" value="#{testBean.values().toArray()}" var="testVar" ajaxKeys="#{testBean.ajaxKeys()}">
                                          <rich:column>
                                                  <f:facet name="header">
                                                         <h:outputText value="Test Column" />
                                                   </f:facet>

                           

                                                   <a4j:region renderRegionOnly="true">
                                                        <s:decorate id="testDecorate" template="../layout/test.xhtml">
                                                                   <h:inputText id="testValue" value="#{testVar}" converter="testConverter">
                                                                            <a4j:support event="onchange" action="#{testBean.updateTestValue(testVar, rich:clientId('testOutputPanel'))}"
                                                                                        reRender="testDecorate, testFooter"
                                                                                        ajaxSingle="true" eventsQueue="testQueue" status="inProgress" requestDelay="50"/>

                           

                                                                               <ui:remove><!-- Hidden field to store PK of test object - used by converter --></ui:remove>
                                                                              <h:outputText value="#{testVar.id}" styleClass="displayNone" />
                                                                     </h:inputText>
                                                       </s:decorate>
                                                   </a4j:region>

                           

                                                   <f:facet name="footer">
                                                           <h:outputText id="testFooter" value="#{testBean.calculateTestValue(testVar, rich:clientId('testOutputPanel'))}%" />
                                                   </f:facet>
                                              </rich:column>
                                       </rich:dataTable>
                              </rich:tab>

                           

                          </ui:composition>

                           

                           

                          public void updateTestValue(TestEntity testEntity, String messageId) {
                              try {
                                      .... interact with testEntity adding message to faces message queue if
                                      something goes wrong...
                              } catch(Exception ex) {
                                      FacesContext.getCurrentInstance().addMessage(messageId, new FacesMessage(FacesMessage.SEVERITY_ERROR, ex.getMessage()));
                              }
                          }

                           

                          Note: the above example is a simplified version of some production code - it is not guaranteed to work and is only for illustrative purposes.

                           

                           

                          • 10. Re: [RichFaces] Render component outside a region
                            Ilya Shaikovsky Master

                            change

                            <a4j:outputPanel id="testMessages">
                            

                            to

                            <a4j:outputPanel id="testMessages" ajaxRendered="true">
                            

                            and remove renderRegionOnly from region as it prevents the components outside the region from to be updated

                            • 11. Re: [RichFaces] Render component outside a region
                              Philip Murphy Newbie

                              Hi Ilya,

                               

                              Thanks for the reply and sorry for late response. This issue ultimately turned out to be due to me not setting the correct Ajax keys on the table that needed to be re-rendered. So when re-rendering the wrong rows were being redrawn.

                               

                              To solve the problem I added the following onfocus event to any components on the screen that need to change the current re-render region (that is, the current set of Ajax keys). When the user moves from one region to the next I re-set the Ajax keys to the currently selected region.

                               

                              <h:inputText id="myField" ...>

                                   <a4j:support event="onfocus" action="#{myAction.resetAjaxKeys(_myEntity)}" ajaxSingle="true"
                                                                                          eventsQueue="myQueue" immediate="true" bypassUpdates="true" />

                              </h:inputText>

                               

                              This makes sense for my business scenario as I have lots of tables on the same screen that repeat different data.

                               

                              Cheers,

                               

                              Philip