JSF-dialog disappears instantly

Question

On my JSF page I'm displaying a simple database table in a dataTable. I want to be able to edit rows in this table. As a solution I made a dialog pop up when you click the value in the first column. I set the current row/entity in my backing bean using setPropertyActionListener. This seems to work. However, the popup disappears after a fraction of a second. I don't understand why this is. Does anyone have a suggestion?

Here is the JSF-code of my dataTable: (as you can see I'm using PrimeFaces)

<h:form id="dataForm">
    <p:dataTable value="#{misterBean.values}" var="value">
        <p:column>
            <h:commandLink value="#{value.name}" onclick="updateDlg.show()">
                <f:setPropertyActionListener
                    target="#{misterBean.value}"
                    value="#{value}" />
            </h:commandLink>
        </p:column>
        <!-- more columns -->
    </p:dataTable>
</h:form>

and the JSF-code for the dialog:

<p:dialog id="updateDialog" header="Update data" widgetVar="updateDlg">
    <h:form id="updateForm">
        <h:panelGrid columns="2" cellpadding="5">
            <h:outputLabel for="name" value="Name:" />
            <p:inputText id="name" value="#{misterBean.value.name}" />
            <h:outputLabel for="flag" value="Flag:" />
            <p:selectBooleanButton id="flag"
                value="#{misterBean.value.flag}"
                onLabel="On"
                offLabel="Off" />
            <f:facet name="footer">
                <p:commandButton id="submitButton"
                    value="Submit"
                    actionListener="#{misterBean.update}"
                    oncomplete="updateDlg.hide()"
                    update=":dataForm" />
            </f:facet>
        </h:panelGrid>
    </h:form>
</p:dialog>

The backing bean looks like this:

@Controller
@ManagedBean( name = "misterBean" )
@ViewScoped
public final class MisterBean {

    private final MyService myService;
    private final List<Value> values;
    private Value value;

    @Autowired
    public MisterBean( final MyService myService ) {
        this.myService = myService;
        this.values = this.myService.loadValues();
        this.value = new Value();
    }

    public List<Value> getValues() {
        return this.values;
    }

    public Value getValue() {
        return this.value;
    }

    public void setValue( final Value value ) {
        this.value = value ;
    }

    public void update( final ActionEvent e ) {
        this.myService.save( this.value );
        this.value = new Value();
    }

}

And how about your javascript code for 'updateDlg.show()'? Tell me if I'm wrong but the onClick can only call a clientside javascript method. The same isue with 'updateDlg.hide()'. — Reporter
I did the same on a different page and it works there. In any case: I actually see the dialog very briefly, so I guess the show() works. I admit I don't really know how this works though. — Rinke
You're submitting the form synchronously instead of asynchronously by ajax. — BalusC

Catfish Catfish · Accepted Answer · 2012-10-04T15:01:16

Could it be that the page is refreshing right after the dialog is shown? I would suggest trying to use the primefaces commandLink rather than the native jsf commandLink since the primefaces commandLink has ajax=true set by default I believe.

change <h:commandLink... to <p:commandLink...

JSF-dialog disappears instantly

1 Answers