Confirmed jQuery UI dialog box does not return true / false

advertisements

I have jQuery UI confirm dialog:

function fnComfirm(title, content) {
    $("#dialog:ui-dialog").dialog("destroy");
    $("#dialog-confirm p").html(content);
    $("#dialog-confirm").dialog({
        title: title,
        resizable: false,
        height: 200,
        width: 486,
        modal: true,
        buttons: {
            "OK": function() {
                $( this ).dialog("close");
                return true;
            },
            Cancel: function() {
                $( this ).dialog("close");
                return false;
            }
        }
    });
}

Called by JSF2 html:

<a4j:commandButton action="#{userBean.makeSomething()}"  type="button" onclick="if (fnValidateUsersList()) {return fnComfirm('Delete User', 'Bla bla')}" />

But I can't get true/false value from this function. I saw many questions here on this site about it, tried all of them, but still get no success.

UPDATE: output of <a4j:commandButton>:

<input type="button" value="Make Something" onclick="jsf.util.chain(this,event,&quot;if (fnValidateUsersList()) {return fnComfirm('Delete User', 'Bla bla')}&quot;,&quot;RichFaces.ajax(\&quot;frm:j_idt25\&quot;,event,{\&quot;incId\&quot;:\&quot;1\&quot;} )&quot;);return false;" name="frm:j_idt25" id="frm:j_idt25">


Here an approach that I use (You can take the general idea for your example)

You need two buttons

First one will be hidden and will be called as a result of clicking Yes in the confirm dialog, this hidden button will be the one that will call the server side method and will do the render using the f:ajax

<h:commandButton id="myHiddenButtonID" value="DeleteHiddenButton" action="#{userBean.makeSomething()}" style="display:none">
    <f:ajax render="@form" ></f:ajax>
</h:commandButton>

Second button will open the dialog, this button will also submit the form to the server with execute="@form" (in case you have selection column in table (select several columns in table and click button to delete) that you want to to update in the server bean for example)

<h:commandButton value="Delete">
    <f:ajax execute="@form" onevent="openDialogFunc()"></f:ajax>
</h:commandButton>

now to the implementation of the js function

function openDialogFunc(data){
    if (data.status === 'success') {
        $('#dialog').dialog({
                    title: title,
                    resizable: false,
                    height: 200,
                     width: 486,
                     modal: true,
         buttons: {
                 "Ok": function() {
                     $("#myHiddenButtonID").click();
                     $(this).dialog("close");
                 },
                 "Cancel": function() {
                     $(this).dialog("close");
                 }
             }
         });
    }
}

Notice that only upon clicking the OK dialog button there will be an execution of your hidden button $("#myHiddenButtonID").click(); otherwise nothing will happen...

took this from similar question that I have answered in the past How to implement JQuery confirm dialog with JSF