Question

I am using a popup where the popup is on rich model panel
when I am trying to create new value and click on save button and there is no value where required is true i get err message (like i want to !!!!) but if this person click on close (x button) the next time this pop is loaded and showmodelpanel is being called(on update mode where i try to take the city value from a jsf bean) no value is written (where there should be one !!!! this is my bug )

I want that after someone close my popup even thought he got an err massage from validation facet ‘the next time he open the pop up new values will be entered

NOTICE : the disabled face is ok but inserting the values is not (odd….)

can someone explain what is the problem (provably something about the jsf faces , how can I restore the page to his original status after validation err ? )

  <rich:modalPanel id="DefineEntityAddress" width="400" height="300"
autosized="true">
<h:graphicImage value="/images/close.png" styleClass="hidelink"
            id="DefineEntityAddressHidelink" />
        <rich:componentControl for="DefineEntityAddress"
            attachTo="DefineEntityAddressHidelink" event="onclick"
            operation="hide">

.
.
.

 <h:form>
 <t:div style="display:block;height:17px;">
                        <rich:comboBox required="true" id="suggestionBoxCity"
                            value="#{DefineEntityAddressControl.chossenCity}"
                            suggestionValues="#{DefineEntityAddressControl.allCityNames}"
                            directInputSuggestions="true" required="true"
                            disabled="#{DefineEntityAddressControl.readOnly}"
                            listStyle="text-align: right;" tabindex="12">
                            <a4j:support event="onchange" reRender="suggestionBoxStreet"></a4j:support>
                        </rich:comboBox>
                    </t:div>
                    <a4j:outputPanel ajaxRendered="true">
                        <t:message for="suggestionBoxCity" styleClass="dyna_error"></t:message>
                    </a4j:outputPanel>
                </a4j:region>


<a4j:commandButton id="save" value="#{l.save}"
            oncomplete=" closeModalPanel();"                
            reRender="hidden,saveError,saveError1,#{DefineEntityAddressControl.ok ? DefineEntityAddressControl.callinglabalTorerender : l.end_date}"
            disabled="#{DefineEntityAddressControl.toDelivery}"
            action="#{DefineEntityAddressControl.save}"
            styleClass="actionButton" />

</h:form>

</rich:modalPanel>

Answer 1

It is a known JSF ‘feature’. When form is submitted, components in JSF tree are updated with the submitted values. Then validation failed, so model (DefineEntityAddressControl.chossenCity, etc.) is not updated. But submitted values are still in the components tree, and JSF legally renders that values on UI (allowing user to correct that).

Solution is to clear submitted value on ‘Close’ button click.

/**
 * Clears all the submitted values of input components in the same form as the specified component.
 * Call this method from action listener, e.g.
 * In Java bean:
 * {@code
 * public void processCloseAction(ActionEvent e) {
 *    clearSubmittedValues(e.getComponent());
 * }
 * }
 *
 * At page:
 * {@code
 * <a4j:commandButton actionListener="#{bean.processCloseAction}"
 *                    ajaxSingle="true"
 *                    limitToList="true"
 *                    oncomplete="Richfaces.hideModalPanel('#{id}')"
 *                    value="Cancel"/>
 * }
 *
 * @param component child of the form to be cleared
 */
public void clearSubmittedValues(UIComponent component) {
    while (component != null) {
        if (component instanceof UIForm || component instanceof UIAjaxRegion
                || component instanceof UIModalPanel) {
            clearRegion(component);
        }
        component = component.getParent();
    }
}

public void clearRegion(UIComponent parent) {
    for (UIComponent component : parent.getChildren()) {
        if (component instanceof EditableValueHolder) {
            EditableValueHolder input = ((EditableValueHolder) component);
            input.setSubmittedValue(null);
            // The following is only needed for immediate input components
            // but it won't do any harm in other situations..
            input.setValue(null);
            input.setLocalValueSet(false);
        } else {
            clearRegion(component);
        }
    }
}