Primefaces dialog framework not working while using ajax listener

4.2k Views Asked by At

I'm trying to open dialog using Primefaces 4 dialog framework,

public void openDialog(String viewName) {
  RequestContext.getCurrentInstance().openDialog(viewName);
}

This works:

<p:commandButton value="Click" action="#{impaktDialogBean.openDialog('/popup/test2')}"/>

This doesn't:

<p:commandButton value="Click">     
  <p:ajax event="click" listener="#{impaktDialogBean.openDialog('/popup/test2')}" ></p:ajax>
</p:commandButton>

So, Primefaces dialog framework only works with action & actionListener?????

I'm using:

  • Primefaces 4
  • Tomcat 7
  • JSF 2.2.6 Mojarra

Thanks.

3

There are 3 best solutions below

1
On

You have this:

public void openDialog(String someView) {
    RequestContext.getCurrentInstance().openDialog(someView);
}

So when you do this:

<h:form id="form">
    <p:commandButton id="button" value="Click" actionListener="#{bean.openDialog('someView')}" />
</h:form>

You recieve this in your Ajax response:

PrimeFaces.openDialog({
    url:'/some/address/view.xhtml',
    pfdlgcid:'cf8e7955-a6cf-4dd8-9a07-55cd29696a64',
    sourceComponentId:'form:button',
    sourceWidget:PF('widget_form_button'),
    options:{}});

So, you can try this:

<h:form id="form">
    <p:commandButton id="button" value="Click" onclick="PrimeFaces.openDialog({
        url:'/some/address/view.xhtml',
        pfdlgcid:'cf8e7955-a6cf-4dd8-9a07-55cd29696a64',
        sourceComponentId:'form:button',
        sourceWidget:PF('widget_form_button'),
        options:{}});" />
</h:form>

You can even use the return value:

<h:form id="form">
    <p:growl id="growl" showDetail="true" />

    <p:commandButton id="button" value="Click" onclick="PrimeFaces.openDialog({
        url:'/some/address/view.xhtml',
        pfdlgcid:'cf8e7955-a6cf-4dd8-9a07-55cd29696a64',
        sourceComponentId:'form:button',
        sourceWidget:PF('widget_form_button'),
        options:{}});">

        <p:ajax event="dialogReturn" listener="#{bean.returnedValue}" update="growl" />
    </p:commandButton>
</h:form>

The AJAX is just to turn the outcome to the destination url. If you already have the destination url, you dont need to do it. In my basic tests this works well, exactly like the original, except that you must pass the destination address in the 'url' field, not the outcome.

Hope this helps.

0
On

The easiest solution I've found is to fire up the button via javascript.

The button that opens the dialog (maybe hidden):

<p:commandButton id="myButton" action="#{bean.openMyDialog}" style="display:none" />

The ajax event that 'clicks' the button:

<p:ajax ... oncomplete=" $('#myButton').click() " />
0
On

I know the question was asked long time ago but for future times...

What about a <p:remoteCommand> ?

<p:remoteCommand name="remoteCmd" update="anything" actionListener="#{impaktDialogBean.openDialog('/popup/test2')}" />

<p:commandButton value="Click" update="anything" onclick="remoteCmd()" >

Different approach to achieve a javascript call to your bean.