7 Replies Latest reply on Apr 17, 2007 5:23 AM by krica

    Only one modalPanel per page?

    krica

      Hi,

      I don't know if this is a bug or feature, but only the action buttons on the first modalPanel in my page actually execute the action.

      I have a page with a Bid. The user has the option to "Confirm" or "Withdraw" the Bid. Each choice should display a confirmation modalPanel:

      <a href="javascript:Richfaces.showModalPanel('viewBidForm:confirmingConfirm')">...</a>
      <a href="javascript:Richfaces.showModalPanel('viewBidForm:confirmingWithdraw')">...</a>
      ...
      <rich:modalPanel id="confirmingWithdraw">
      ...
      <h:commandButton value="Yes" action="#{bidderViewBidManager.yesConfirmWithdraw}"/>
      ...
      </rich:ModalPanel>
      
      <rich:modalPanel id="confirmingConfirm">
      ...
      <h:commandButton value="Yes" action="#{bidderViewBidManager.yesConfirmConfirm}"/>
      ...
      </rich:ModalPanel>
      




        • 1. Re: Only one modalPanel per page?
          krica

          Oops! Seems like the end of the message got eaten.

          If I move the "confirmingConfirm" modalPanel definition above the "confirmingWithdraw", then that modalPanel's commandButton works but not the other one. This means that the actual action method is not at fault.

          I am using 3.0.1 snapshot bundled with Seam 1.2.1 (later ones creates all sorts of problems).

          • 2. Re: Only one modalPanel per page?

            Usually, the action method is not invoked if validation phase is failed. Your code snippet has not enough information to suggest anything about the source of your problem.
            P.S. Be sure, you have a individual form for each modal panel. It is very important for any future versions.

            • 3. Re: Only one modalPanel per page?
              krica

              Thanks for your response Sergey. How can validation have anything to do with it if the commandButton works by simply moving the containing modalPanel around? Two modalPanels: the first works, the second does not, regardless of which modalPanel it is. Regardless, there is no validation on this page anyway. Here's the full listing:

              <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <ui:composition xmlns="http://www.w3.org/1999/xhtml"
               xmlns:ui="http://java.sun.com/jsf/facelets"
               xmlns:h="http://java.sun.com/jsf/html"
               xmlns:f="http://java.sun.com/jsf/core"
               xmlns:s="http://jboss.com/products/seam/taglib"
               xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
               xmlns:rich="http://richfaces.ajax4jsf.org/rich"
               template="/templates/template.xhtml">
              
              <!-- content -->
              <ui:define name="content">
               <h:form id="viewBidForm">
              
               <h:panelGroup id="createBidGroup" rendered="#{bidderRules.canCreateBid}">
               <p>#{messages.text_BidderNoBid}</p>
               <s:link value="#{messages.label_CreateNewBid}" action="#{bidderViewBidManager.createBid}"/>
               </h:panelGroup>
              
               <h:panelGroup id="viewBidGroup" rendered="#{bidderRules.canViewBid}">
               <p>#{messages.text_CurrentBid}</p>
               <h:outputText value="#{messages.text_YourBidIsWithdrawn}" rendered="#{bidderViewBidManager.withdrawn}"
               styleClass="alertMessage"/>
               <h:panelGrid columns="1">
               <h:panelGrid id="bidActionsGroup" cellpadding="5" columns="3" rendered="#{bidderRules.canEditBid}">
               <h:commandButton id="mieb" value="#{messages.label_editBidMenuEditBid}" action="#{bidderViewBidManager.editBid}"/>
               <a href="javascript:Richfaces.showModalPanel('viewBidForm:confirmingConfirm')"><input type="button" value="#{messages.label_editBidMenuConfirmBid}"/></a>
               <a href="javascript:Richfaces.showModalPanel('viewBidForm:confirmingWithdraw')"><input type="button" value="#{messages.label_editBidMenuWithdrawBid}"/></a>
               </h:panelGrid>
               <h:panelGroup id="bidTable">
               <rich:dataTable id="bidItemsTable" value="#{bidderViewBidItems}" var="bidItemRow">
               <h:column>
               <f:facet name="header">
               <h:outputText value="#{messages.label_Price}"/>
               </f:facet>
               <h:outputText value="#{bidItemRow.price}">
               <f:convertNumber maxFractionDigits="2" minFractionDigits="2"/>
               </h:outputText>
               </h:column>
              
               <h:column>
               <f:facet name="header">
               <h:outputText value="#{messages.label_Volume}"/>
               </f:facet>
               <h:outputText value="#{bidItemRow.volume}">
               <f:convertNumber integerOnly="true" groupingUsed="true"/>
               </h:outputText>
               </h:column>
               </rich:dataTable>
               </h:panelGroup>
               <h:panelGroup id="bidCorrGroup" rendered="#{bidderRules.canReqCorrection}">
               <s:link value="#{messages.label_ReqBidCorrection}" view="/restricted/reqBidCorrection.xhtml" propagation="join">
               <f:param name="bidId" value="#{bidHome.id}"/>
               </s:link>
               </h:panelGroup>
               </h:panelGrid>
              
               </h:panelGroup>
              
               <rich:modalPanel id="confirmingWithdraw" height="100">
               <f:facet name="header">
               <h:outputText value="#{messages.label_ConfirmBidWithdraw}"/>
               </f:facet>
               <h:form id="withdrawForm">
               <h:panelGrid width="100%" cellpadding="0" cellspacing="0" columns="1">
               <rich:spacer height="5"/>
               <h:outputText value="#{messages.msg_ConfirmBidWithdraw}"/>
               <rich:spacer height="5"/>
               <h:panelGroup>
               <center>
               <h:commandButton styleClass="popupPanelButton" value="#{messages.label_Yes}" action="#{bidderViewBidManager.yesConfirmWithdraw}"/>
               <rich:spacer width="5"/>
               <h:commandButton styleClass="popupPanelButton" value="#{messages.label_No}"
               action="#{bidderViewBidManager.noConfirmWithdraw}"/>
               </center>
               </h:panelGroup>
               </h:panelGrid>
               </h:form>
               </rich:modalPanel>
              
              
               <rich:modalPanel id="confirmingConfirm" height="100">
               <f:facet name="header">
               <h:outputText value="#{messages.label_Confirm}"/>
               </f:facet>
               <h:form id="confirmForm">
               <h:panelGrid width="100%" cellpadding="0" cellspacing="0" columns="1">
               <rich:spacer height="5"/>
               <h:outputText value="#{messages.msg_ConfirmBidConfirm}"/>
               <rich:spacer height="5"/>
               <h:panelGroup>
               <center>
               <h:commandButton styleClass="popupPanelButton" value="#{messages.label_Yes}"
               action="#{bidderViewBidManager.yesConfirmConfirm}"/>
               <rich:spacer width="5"/>
               <h:commandButton styleClass="popupPanelButton" value="#{messages.label_No}"
               action="#{bidderViewBidManager.noConfirmConfirm}"/>
               </center>
               </h:panelGroup>
               </h:panelGrid>
               </h:form>
               </rich:modalPanel>
               </h:form>
              
              </ui:define>
              
              </ui:composition>
              


              In this case the commandButton with action "bidderViewBidManager.yesConfirmWithdraw" works as expected, but not "bidderViewBidManager.yesConfirmConfirm". Once again, if I mode the whole "confirmingConfirm" modalPanel above the "confirmingWithdraw", then "bidderViewBidManager.yesConfirmConfirm" works but not "bidderViewBidManager.yesConfirmWithdraw".

              Also, note that there are nested forms. I do not know if this is allowed, but moving the outer form's closing tag above the modalPanel definitions makes the modalPanels completely inert. Of course, doing that also makes the page work in IE7 (excl. the modalPanel behaviour). As is listed above, this page does not work in IE7 ("ellement" is null error).

              • 4. Re: Only one modalPanel per page?
                krica

                No help to be found here? Please?

                • 5. Re: Only one modalPanel per page?

                  Nested forms are not the best decission. Close your "viewBidForm" after end of panelGroup and before the first modalPanel.

                  And use the latest snapshoot. It must work.

                  • 6. Re: Only one modalPanel per page?

                    Nested forms are not the best decission. Close your "viewBidForm" after end of panelGroup and before the first modalPanel.

                    And use the latest snapshoot. It must work.

                    • 7. Re: Only one modalPanel per page?
                      krica

                      Thanks Alexander,

                      Can't say what exactly did it, but I moved the closing form tag like you said, moved the form modalPanle's form to enclose the modalPanel, and updated to latest snapshot.

                      Except for the latest snapshot, I tried all this before (I think :)), with no success. But now it works.

                      Thanks again!