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.

[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?

[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?

[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

[fmarwede]

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.

[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

[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.

[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>

[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.