2 Replies Latest reply on May 12, 2009 2:42 AM by luxspes

    ModalPanel is closed automatically in a specific short duration

    pramanish
      Hi All,

      I am using Modal Panel in my web page but here in my case, ModalPanel is closed automatically and that duration is very short.
      If i have form in ModalPanel, in that case it may happen that before the user finish filling input it may be closed automatically.

      Following is my xhtml code:

      <ui:define name="main">
           
          <h:messages globalOnly="true" styleClass="message" />
          <f:facet name="header">createCustomer</f:facet>

         <rich:panel><f:facet name="header">richTable</f:facet>
        
           
         <h:form id="testform">
         <h:outputText id="test" value="#{columnList.size()}" />
         
            <rich:dataTable  value="#{rowList}" var="testTableObj" width="750">
              <f:facet name="header">
                              <rich:columnGroup>
                                 <rich:column>
                                      <rich:spacer />
                                  </rich:column>
                                  <rich:column colspan="#{testTableManager.conditionFields}">
                                      <h:outputText value="Input Fields" />
                                  </rich:column>
                                  <rich:column colspan="4">
                                      <h:outputText value="Result Fields" />
                                  </rich:column>
                                   <rich:column colspan="4">
                                   <h:commandButton  action="#{testTableManager.addInputField}" onclick="javascript:Richfaces.showModalPanel('panel');" value="" />
                                  </rich:column>
                              </rich:columnGroup>
               </f:facet>
                  <rich:columns  value="#{columnList}" var="colm" index="indx" width="200px" styleClass="#{colm.cssClass}"> 
                      <f:facet name="header">
                          <h:outputText value="#{colm.header}"/>
                      </f:facet>
                     <s:div>
                     <c:set var="test1" value="#{indx}"></c:set><!--
                     <c:if  test="#{test1 > 0}" var="result"/>
                     <c:if  test="#{((testTableObj[indx])[0]!='0')}" var="test2"/>
                    --><!--<c:set var="test2" value="#{((testTableObj[indx])[0]=='0')}"></c:set>
                    --><!--<c:set var="test2" value="#{result}"></c:set>-->
                    <c:set var="test2" value="#{(testTableObj[indx])[0]}"></c:set>
                    <!--<c:if  test="#{(testTableObj[indx])[0] == 0}" var="result"/>-->        
                    <c:if test="#{colm.isCondition}">                   
                       <rich:comboBox defaultLabel="Enter some value" value="#{(testTableObj[indx])[0]}" width="35px" >
                            <f:selectItem itemValue=">"/>
                            <f:selectItem itemValue="&lt;"/>
                            <f:selectItem itemValue=">="/>
                            <f:selectItem itemValue="=="/>
                           </rich:comboBox>
                        </c:if>
                      <c:choose>
                          <c:when test="#{indx > 0}">
                                  <h:inputText value="#{(testTableObj[indx])[1]}" size="6" />
                            </c:when>
                          <c:otherwise>
                                  <h:outputText value="#{(testTableObj[indx])[1]}" size="6" />
                            </c:otherwise>
                     </c:choose>
                     </s:div>
                  </rich:columns>
              </rich:dataTable>
          </h:form>

         </rich:panel>
         <h:form>
             <rich:modalPanel id="panel" width="400" height="300" domElementAttachment="">
              <f:facet name="header">
                  <h:outputText value="Modal Panel"/>
              </f:facet>
               <a4j:commandButton action="#{testTableManager.setInputFieldName('Test')}" value="Add Input Field" reRender="testform" oncomplete="javascript:Richfaces.hideModalPanel('panel')" />
          </rich:modalPanel>
         </h:form>
        </ui:define>


      Please,help me to resolve this problem.

      Thanks in advance.

      Regards,
      Manish
        • 1. Re: ModalPanel is closed automatically in a specific short duration
          gonorrhea

          You most likely do not need all those JSTL tags (i.e. <c:when>, <c:otherwise>, etc.)  I have been using JSF/RF/facelets for 2 years now and never used those tags.  The Seam example projects don't use those tags either.


          Write a new basic xhtml page with a h:form and h:commandButton to display the rich:modalPanel.  Isolate the problem.  This means determine if the root cause is the modalPanel or other code in your xhtml.


          example:


          <h:form>
               <a4j:jsFunction name="rerenderModal" 
                         reRender="dataModalDiv"
                         oncomplete="Richfaces.showModalPanel('mpanel1');" />
          </h:form> 
          
          <h:form>
          
          <a4j:commandLink id="mod1" 
                                                                                   value="view modal"
                                                                                   action="#{createRepairCase.getEquipmentHistoryList}"
                                                                                   ajaxSingle="true"
                                                                                   oncomplete="rerenderModal();" />     
          
          </h:form>
          
          <rich:modalPanel id="mpanel1" width="600" height="600">
          
                              <f:facet name="header">
                                   <h:panelGroup>
                                        <h:outputText
                                             value="Equipment History" />
                                   </h:panelGroup>
                              </f:facet>
                              
                              <f:facet name="controls">
                                <h:panelGroup>
                                    <h:graphicImage value="/img/close.png" id="hidelink1">
                                         <rich:componentControl for="mpanel1" attachTo="hidelink1" operation="hide" event="onclick"/>
                                    </h:graphicImage>
                                </h:panelGroup>
                            </f:facet>
          ...embed text or form here...
          </rich:modalPanel>
          

          • 2. Re: ModalPanel is closed automatically in a specific short duration

            Manish Patel wrote on May 11, 2009 17:41:


            Hi All,

            I am using Modal Panel in my web page but here in my case, ModalPanel is closed automatically and that duration is very short.
            If i have form in ModalPanel, in that case it may happen that before the user finish filling input it may be closed automatically.




            I have had this problem when I started using  Richfaces, the problem is, IMO here:

               <h:form>
                   <rich:modalPanel id="panel" width="400" height="300" domElementAttachment="">
                    <f:facet name="header">
                        <h:outputText value="Modal Panel"/>
                    </f:facet>
                     <a4j:commandButton action="#{testTableManager.setInputFieldName('Test')}" value="Add Input Field" reRender="testform" oncomplete="javascript:Richfaces.hideModalPanel('panel')" />
                </rich:modalPanel>
               </h:form>
            
            



            You are using a a4j:commandButton inside a h:form, that will make AJAX behavior work incorrectly, you should be using a4j:form. This is probably causing a full reload of the page (instead of only an ajax rerender.



            Please,help me to resolve this problem.

            Thanks in advance.

            Regards,
            Manish