2 Replies Latest reply on Apr 8, 2010 11:59 AM by Ambrish Singh

    Using required="true" with <h:inputText> inside Modal panel

    Ambrish Singh Newbie

      Hi Everyone,


      I am rendering a modal panel on button click. Inside modal panel , I have entered some invalid values,so that the validation fails.


      Now I close the modal panel,and again open it , this time the values last entered are appearing for fields inside modal paenl.


      Here is the code for rendering a modal panel.




      <h:form id="showAddform">
      <h:panelGrid columns="1" columnClasses="name" styleClass="panelGrid">
           <a:commandButton id="addUserButton" value="#{messages.btnNewUser}"
           reRender="commonPanel" action="#{userAction.renderAddUser}" />
      </h:panelGrid>
      </h:form>



      and code for modal panel is ,




      <a:outputPanel id="commonPanel">
                     <rich:modalPanel id="commonMp"
                          styleClass="modalPanel" top="10"
                          keepVisualState="#{userAction.showOverlay}"
                          autosized="true" minWidth="600" minHeight="200"
                          style="background-image: url('../img/overlayBg.png');background-repeat: repeat;background-color: transparent;"
                          shadowDepth="#{messages.valShadowDepth}"
                          headerClass="modalPanel-header" controlsClass="modalPanel-controls">
                          <f:facet name="header">
                               <h:outputText value="#{messages.lblAddEditUser}" />
                          </f:facet>
                          <f:facet name="controls">
                               <h:form>
                                    <a:commandLink action="#{userAction.closeLayer}"
                                         oncomplete="Richfaces.hideModalPanel('commonMp')">
                                         <h:graphicImage value="/img/closeButton.png" alt="X" border="0" />
                                    </a:commandLink>
                               </h:form>
                          </f:facet>
                          <s:div styleClass="modalPanel-panelGrid-container-div">
                               <h:panelGrid styleClass="modalPanel-panelGrid">
                                    <a:outputPanel ajaxRendered="true">
                                         <h:message styleClass="message" for="commonPanel" />
                                    </a:outputPanel>
                                    <a:form id="addEditUserForm">
                                         <h:panelGrid columns="2" border="0"
                                              columnClasses="formLabel,formValue" rowClasses="formLabel">
      
                                              <s:decorate id="nameDecoration" template="../layout/edit.xhtml">
                                                   <ui:define name="label">#{messages.lblUsername}</ui:define>
                                                   <h:inputText id="name" required="true" 
                                                   requiredMessage = "Value is required" 
                                                   value="#{userBean.username}" />
                                              </s:decorate>
      
                                         </h:panelGrid>
                                         <h:panelGrid columns="1" border="0" width="100%"
                                              columnClasses="formLabel,formValue" rowClasses="formLabel">
                                              <s:decorate id="descDecoration" template="../layout/edit.xhtml">
                                                   <ui:define name="label">#{messages.lblDescription}</ui:define>
                                                   <h:inputTextarea id="desc" rows="8" cols="65" required="true"
                                                        value="#{userBean.txtDescription}" requiredMessage = "Description is required" />
                                              </s:decorate>
                                         </h:panelGrid>
      
                                         <h:panelGrid width="330" id="save">
                                              <a:commandButton id="saveUserButton"
                                                   value="#{messages.btnSave}"
                                                   reRender="commonPanel"
                                                   action="#{userAction.persistUserDetails}"
                                                   onclick="this.disabled=true" style="margin: 3px"
                                                        rendered="#{userBean.iUserId == null}" />
                                              <a:commandButton id="updateUserButton"
                                                   value="#{messages.btnUpdate}"
                                                   reRender="commonPanel"
                                                   action="#{userAction.updateUserDetails}"
                                                   onclick="this.disabled=true" style="margin: 3px"
                                                   oncomplete="this.disabled=false"
                                                   rendered="#{userBean.iUserId != null}" />
      
                                         </h:panelGrid>
                                    </a:form>
                               </h:panelGrid>
                          </s:div>
                     </rich:modalPanel>
                </a:outputPanel>




      But if I removed the required="true" attribute on the <h:inputText> and <h:inputTextArea> then Modal Panel on re-opens doesn't shows the last entered values. But in this case , i am unable to validate the form.


      Thanks & Regards


      Ambrish