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

    Unable to get field submitted

    bostone

      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
          lucab

          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

            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
              bostone

              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

                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
                  bostone

                  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

                    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
                      bostone

                       

                      "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

                        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.