richfaces popupPanel: commandButton requires two clicks

Question

I have a popup window with a form and a commandButton on it. When I click on the commandButton, I would like to submit the form and call an action.

The problem is that if I put the commandButton in the form, I have to click on it twice to call the action, and if I put it outside the form, it doesn't submit the form.

Here is my code:

<rich:popupPanel id="popup" modal="true" minWidth="600" minHeight="300"
    resizeable="false">
    <f:facet name="header">
        <h:outputText value="Edit" />
    </f:facet>
    <f:facet name="controls">
        <h:outputLink value="#" id="x"
            onclick="#{rich:component('popup')}.hide(); return false;">X</h:outputLink>
    </f:facet>
    <h:form id="dataForm">

        <table id="table">
            <tr>
                <td><h:outputText value="Details:" /></td>
                <td><h:inputTextarea id="details"
                        value="#{errorItemBean.workItem.details}" /></td>
            </tr>               
        </table>

        <a4j:commandButton id="submitButton" value="Ok"
                action="#{errorItemBean.create}" reRender="errorForm"
                oncomplete="#{rich:component('popup')}.hide()">
            </a4j:commandButton>

        <h:commandButton id="cancelButton" value="Cancel">
            <rich:componentControl target="popup" operation="hide" />
        </h:commandButton>
    </h:form>
</rich:popupPanel>

Answer 1

That can happen if you have used reRender=":popup" before opening the popup. You need to re-render the popup's form instead by reRender=":dataForm".

See also:

• Rendering other form by ajax causes its view state to be lost, how do I add this back?