2 Replies Latest reply on Jan 21, 2010 10:33 AM by csimons

    Edit DataTable with Modal Panel issues

    csimons

      I'm trying to edit an object/row from a data table within a modal panel.  I am 100% positive the right object is stored on the backing bean, but the modal panel "remembers" the last selected object, and the form is always showing stale data.

       

      It's as if the getters/setters being called by the inputText form elements are not reRendering or refreshing between successive calls to open the modal panel.  I have seen several discussions about this and even a "Cannot Reproduce" JIRA issue but no working solutions (at least for me).

       

      Can anyone help?

       

      Here is some code...

       

      A4j:CommandLink to set backing bean and open the edit modal panel

      -------------------------------------------------------------------------------------------------------

      <a4j:commandLink
                                                      id="cmdModifyParagraph"
                                                      styleClass="add-table"
                                                      ajaxSingle="true"

                                                      reRender="modifyParagraphForm"
                                                      oncomplete="#{rich:component('modifyParagraphPopup')}.show()">
                                                      <f:setPropertyActionListener value="#{_responseParagraph}"
                                                                                   target="#{responseManager.currentResponseParagraph}"/>

                                                      <ui:include src="#{formHelperBean.editBtnTemplate}">
                                                          <ui:param name="buttonText" value="Edit"/>
                                                      </ui:include>

       

                                              </a4j:commandLink>

       

      Edit ModalPanel

      --------------------------

       

      <rich:modalPanel id="modifyParagraphPopup" minHeight="400" minWidth="500">
          <f:facet name="header">
              <h:outputText value="Modify Paragraph" />
          </f:facet>
          <rich:panel>
             <a4j:outputPanel ajaxRendered="true">
          <h:form id="modifyParagraphForm">
              <rich:messages id="modifyParagraphErrors"
                      infoLabelClass="info-class"
                      errorLabelClass="error-class"
                      fatalLabelClass="fatal-class"
                      warnLabelClass="warn-class"></rich:messages>
                      <ui:decorate template="/layout/forms/table.xhtml">
                          <tr>
                              <s:decorate id="modifyNumberDecorate" template="/layout/forms/edit.xhtml">
                                  <ui:define name="label">Paragraph Number:</ui:define>
                                  <h:inputText id="modifyParaNumber"
                                               required="true"
                                               requiredMessage="Paragraph Number is required"
                                               validatorMessage="Paragraph Number must be a number"
                                               value="#{responseManager.currentResponseParagraph.paraNumber}"></h:inputText>
                              </s:decorate>
                          </tr>
                          <tr>
                              <s:decorate id="modifyTitleDecorate" template="/layout/forms/edit.xhtml">
                                  <ui:define name="label">Paragraph Name:</ui:define>
                              <h:inputText id="modifyParaName"
                                           required="true"
                                           requiredMessage="Paragraph Name is required"
                                          value="#{responseManager.currentResponseParagraph.paraName}"></h:inputText>

       

                              </s:decorate>
                          </tr>

                      </ui:decorate>
                      <ui:decorate template="/layout/forms/action.xhtml">

       

                          <a4j:commandLink
                              id="cmdSubmitManagedParagraph"
                              styleClass="submit"
                              data="#{facesContext.maximumSeverity.ordinal ge 2}"
                              immediate="false"
                              reRender="modifyParaDescription,modifyParaLocation,modifyParaName,modifyParaNumber,modifyParagraphErrorPanel"
                              oncomplete="if(data == false) Richfaces.hideModalPanel('modifyParagraphPopup');"
                              action="#{responseManager.submitManagedParagraph}" >

                              <h:graphicImage value="#{theme.imgdir}/buttons/submit.png"/>
                              <h:outputText value="#{messages['form.button.submit']}"/>
                          </a4j:commandLink>

       

                          <a4j:commandLink id="cmdCancelManagedParagraph" styleClass="cancel"
                                           immediate="true"
                                           reRender="modifyParagraphPopup"
                                           oncomplete="Richfaces.hideModalPanel('modifyParagraphPopup')">
                                  <h:graphicImage value="#{theme.imgdir}/buttons/cancel.png"/>
                                  <h:outputText value="#{messages['form.button.cancel']}"/>
                          </a4j:commandLink>
                      </ui:decorate>

       

          </h:form>
              </a4j:outputPanel>
          </rich:panel>
      </rich:modalPanel>

        • 1. Re: Edit DataTable with Modal Panel issues
          nbelaevski

          Hi,

           

          Please add a4j:log and post logged data here. Also can you please check if getters for the new data were called actually?

          • 2. Re: Edit DataTable with Modal Panel issues
            csimons

            Certainly, here it goes.  Thanks.

             

            Here is the log.info() statement, as you can see (if you look at the screenshots), the backing bean is registering the properly clicked object, but the modal panel is showing a different object (the first object that was selected).

             

            10:24:18,843 INFO  [ResponseManager] modifyParagraph: id= sample - edit
            10:24:18,859 DEBUG [Menu] URL Accessed:/admin/dm/responseTemplates/viewResponseTemplate.seam
            10:25:40,328 INFO  [ResponseManager] modifyParagraph: id= test
            10:25:40,344 DEBUG [Menu] URL Accessed:/admin/dm/responseTemplates/viewResponseTemplate.seam

             

            If I edit the selected object, even if the form input is wrong, it will save the changes against the right object, so furthermore I know that the backing bean property, "currentResponseParagraph", is correct.

             

            I should also clarify that there are multiple dataTables on this page; an a4j:repeat is rendering dataTables, and the "var" of a4j:repeat is "_responseParagraph".  Although this is different than the example, I again can confirm that the right object is being passed to the backing bean, but only the modalPanel's form is not being refreshed.

             

            Thank you for investigating this further.