13 Replies Latest reply on Dec 18, 2012 8:36 AM by gonzalad

    RF ajax rendering of content which contains another form

    gonzalad

      Hello,

       

      This problem is related to http://balusc.blogspot.fr/2011/09/communication-in-jsf-20.html#AjaxRenderingOfContentWhichContainsAnotherForm.

       

      I have a problem when using RF a4j:commandButton to update a second form.

       

      When using plain h:commandButton with f:ajax, everything works fine (just nedd to follow balucs advice on multi form ajax - see link before).

       

      When using a4j:commandButton to update the second form, the second form is updated but the javax.faces.ViewState input is missing in secondForm.

       

      Sample JSF page showing a4j:commandButton not working :

       

       

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml"
            xmlns:f="http://java.sun.com/jsf/core"
            xmlns:a4j="http://richfaces.org/a4j"
            xmlns:h="http://java.sun.com/jsf/html">
      
          <h:head>
              <title>Richfaces 4.x Hello World</title>
          </h:head>
          <h:body>
              <h:panelGroup id="firstPanel">
                  <h:form id="firstForm">
                      <h:outputLabel for="input" value="First form input" />
                      <h:inputText id="input" value="#{bean1.input}" required="true" />
                      <a4j:commandButton value="Submit form" action="#{bean1.submit}" execute="@form" render="@form :secondPanel :secondForm :messages"/>
                      <h:message for="input" />
                  </h:form>
              </h:panelGroup>
              <h:panelGroup id="secondPanel">
                  <h:form id="secondForm">
                      <h:outputLabel for="input" value="Second form input" />
                      <h:inputText id="input" value="#{bean2.input}" required="true" />
                      <a4j:commandButton value="Submit other form" action="#{bean2.submit}" execute="@form" render="@form :firstPanel :firstForm :messages" />
                      <h:message for="input" />
                  </h:form>
              </h:panelGroup>
              <h:messages id="messages" globalOnly="true" layout="table" />
          </h:body>
      </html>
      

       

      Same JSF page with plain h:commandButton / f:ajax components (working) :

       

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml"
            xmlns:f="http://java.sun.com/jsf/core"
            xmlns:a4j="http://richfaces.org/a4j"
            xmlns:h="http://java.sun.com/jsf/html">
      
          <h:head>
              <title>JSF 2.0 Hello World</title>
          </h:head>
          <h:body>
              <h:panelGroup id="firstPanel">
                  <h:form id="firstForm">
                      <h:outputLabel for="input" value="First form input" />
                      <h:inputText id="input" value="#{bean1.input}" required="true" />
                      <h:commandButton value="Submit form" action="#{bean1.submit}">
                          <f:ajax execute="@form" render="@form :secondPanel :secondForm :messages" />
                      </h:commandButton>
                      <h:message for="input" />
                  </h:form>
              </h:panelGroup>
              <h:panelGroup id="secondPanel">
                  <h:form id="secondForm">
                      <h:outputLabel for="input" value="Second form input" />
                      <h:inputText id="input" value="#{bean2.input}" required="true" />
                      <h:commandButton value="Submit other form" action="#{bean2.submit}">
                          <f:ajax execute="@form" render="@form :firstPanel :firstForm :messages" />
                      </h:commandButton>
                      <h:message for="input" />
                  </h:form>
              </h:panelGroup>
              <h:messages id="messages" globalOnly="true" layout="table" />
          </h:body>
      </html>
      

       

       

      Should I open a JIRA issue ?

       

      RF Version used : 4.3.0.20120802-M1

       

      Testcase

       

      Install ajax-another-form maven projet in jboss 7.1.0.

       

      Testing plain JSF f:ajax (works)

      1. http://localhost:8080/ajax-another-form/test-jsf.jsf

      2. Enter a value in First form input

      3. Submit first form

         You should see the message 'First form submitted'

      4. Enter a value in Second form input

      5. Submit second form

         You should see the message 'Second form submitted'

       

      Test a4j:commandButton (doesn't work)

      1. http://localhost:8080/ajax-another-form/test-rf.jsf

      2. Enter a value in First form input

      3. Submit first form

         You should see the message 'First form submitted'

      4. Enter a value in Second form input

      5. Submit second form

         You don't see anything !

         If you click a second time, you'll see 'Second form submitted'

       

      This is related to http://balusc.blogspot.fr/2011/09/communication-in-jsf-20.html#AjaxRenderingOfContentWhichContainsAnotherForm

      Problem is that RF a4j:commandButton doesn't seem to add javax.faces.ViewState input in secondForm when submitting firstForm.

       

      Added sample JSF code

       

      Added JSF working sample with h:commandButton/f:ajax