8 Replies Latest reply on May 14, 2008 3:59 AM by Ilya Shaikovsky

    Unable to get field submitted

    Robert Stone Newbie

      I'm refactoring some code to switch from window pop-up to modal dialog. To my dismay, I cannot submit any fields in the form of modal pop-up beside the button itself. I shorten the code to just a single text field and a button, still nothing.

      I call the modal from the main form by clicking on the button

      <a4j:commandButton id="findContact" value="Manage Contacts" >
       <a4j:actionparam name="contact" value="contact"
       assignTo="#{contactBean.hiddenInput}" />
       <rich:componentControl for="contactSearchPanel"
       operation="show" event="onclick" />
       </a4j:commandButton>


      My modal is in its own xhtml which is linked after the main form (here's last few lines of main xhtml)
      </h:form>
      <a4j:include viewId="contactsPopUp.xhtml" />
      </ui:define>
      </ui:composition>
      </body>
      </html>


      Here's the complete code for pop-up xhtml

      <f:subview 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:a4j="http://richfaces.org/a4j"
       xmlns:rich="http://richfaces.org/rich"
       >
       <h:form id="contactSearchForm">
       <rich:modalPanel id="contactSearchPanel" width="500" height="400">
       <f:facet name="header">
       <h:outputText value="Manage Contacts" />
       </f:facet>
       <f:facet name="controls">
       <h:panelGroup>
       <h:graphicImage value="images/close.png" style="cursor:pointer" id="hidelink" />
       <rich:componentControl for="contactSearchPanel" attachTo="hidelink" operation="hide"
       event="onclick" />
       </h:panelGroup>
       </f:facet>
       <h:inputText id="searchStr" size="25" value="#{contactBean.searchStr}"/>
       <a4j:commandButton id="searchBtn" value="Search" styleClass="button" event="onclick"
       actionListener="#{contactBean.search}" />
       </rich:modalPanel>
       </h:form>
      </f:subview>
      


      And, finally, here's HTTP post after clicking on Submit
      AJAXREQUEST=_viewRoot&j_id131%3Aj_id132%3AcontactSearchForm%3AcontactSearchPanelOpenedState=&j_id131
      
      %3Aj_id132%3AcontactSearchForm_SUBMIT=1&javax.faces.ViewState=w1OFfspRVmQfp9jw3RUunWsjC2gaFd5osuZOv1LCtE1cDIMcu8q12nlKyCsB
      
      %2BfWNqpwfmZnCBf5sOo6mNqViFPqXO2mOuIJ3%2FYWcidBfMsk%3D&j_id131%3Aj_id132%3AcontactSearchForm%3AsearchBtn
      
      =j_id131%3Aj_id132%3AcontactSearchForm%3AsearchBtn&


      Am I doing anything wrong? I need to see value for "searchStr" and it's not in the headers.



        • 1. Re: Unable to get field submitted
          Luca Borzani Newbie

          i'm using forms inside modal panels with no problem. I think you should place the form inside the modal panel (but i don't think surrounding the modalpanel with a form is what causes the problem here). Instead, i have a problem with modal panels + form + enter button.
          When i press the enter button, let's say with the focus on a text field, the entire page will refresh making me really sad. Is there a way to prevent this?

          • 2. Re: Unable to get field submitted
            Ilya Shaikovsky Master

            bostone, you should have for inside and not ourside the modal. Also if you need to open it after ajax request and update modal info - you should change event from onclick to oncomplete and add reRender.

            lucab, why you just can't use event handlers like onclick in order to prevent submit on Enter press?

            • 3. Re: Unable to get field submitted
              Robert Stone Newbie

              OK - I should have learnt by now not to listen to junior programmers... Here's why my form was outside the modal panel: when placed inside, the title bar and X (close) icon would disappear. One guy in our team "discovered" that when the form is placed outside of the modal panel - title and icon are displayed and work just fine. Is this a bug that needs to be reported? If not how to get title and control icon back?

              BTW, placing form inside the <rich:modalPane/> tag in the example above solves the problem however title and "close" icon are no longer displayed

              • 4. Re: Unable to get field submitted
                Florian Marwede Expert

                Don't put forms into forms.

                In your example there is a form outside around everything and a form for the modal panel. Define the modal panel (and its form inside) outside of every other form.

                • 5. Re: Unable to get field submitted
                  Robert Stone Newbie

                  Negative... In my example, if you look closer, <a4j:include/> is _after_ main form closing tag. Again - I no longer have the problem that is described in the post. However, the title bar and close icon are now gone from modal box

                  • 6. Re: Unable to get field submitted
                    Ilya Shaikovsky Master

                    Unfortunatelly I have no such problems while rendering facets within modal panel which has a form inside.

                    Could you please share your example somewhere - bug should be reported for sure if this problem will be reproduced at our side.

                    • 7. Re: Unable to get field submitted
                      Robert Stone Newbie

                       

                      "ilya_shaikovsky" wrote:

                      Could you please share your example somewhere - bug should be reported for sure if this problem will be reproduced at our side.


                      Here's the solution I found: simply place form tag after header/control facets as follows. Still I don't know if placing form immediately after opening tag <rich:modelPanel/> is wrong (which causes the problem I described). If so - it needs to be documented somewhere

                      Example - properly working form
                      <rich:modalPanel id="deviceSearchPanel" width="400" height="350">
                       <f:facet name="header">
                       <h:outputText value="Advanced Device Search" />
                       </f:facet>
                       <f:facet name="controls">
                       <h:panelGroup>
                       <h:graphicImage value="/images/close.png"
                       style="cursor:pointer" id="hidelink" />
                       <rich:componentControl for="deviceSearchPanel"
                       attachTo="hidelink" operation="hide" event="onclick" />
                       </h:panelGroup>
                       </f:facet>
                       <h:form id="deviceSearchForm">
                       <div>
                       <h:outputLink value="#" id="link">
                       Hide Me
                       <rich:componentControl for="deviceSearchPanel"
                       attachTo="link" operation="hide" event="onclick" />
                       </h:outputLink>
                       </div>
                       </h:form>
                       </rich:modalPanel>
                      


                      • 8. Re: Unable to get field submitted
                        Ilya Shaikovsky Master

                        Certainly :) This is wrong.. And there is nothing about Rich Faces or its documentation. Facet - should be direct child of the corresponding component. So placing form just after modalPanel tag - you defined this facets as facets for form - form has no such ones and just nothing rendered.