Why icon Button is not more clickable after closing DialogFramework ?

UI Components for JSF
Post Reply
schlebe
Posts: 212
Joined: 25 Sep 2015, 13:32
Location: Colmar-Berg (Luxembourg)

27 Feb 2018, 12:49

Hello,

currentl, I try to implement a solution that will display a ConfirmDialog after the user has clicked on CLOSE DialogFramework button BUT before DialogFramework is closed.

That seems to work and I will post the complete solution when all will work correctly.

The problem that I have now is that after ConfirmDialog has been displayed and that user click on YES Button to close Confirm dialog and DialogFramework dialog, the form is correclty displayed but the ICON on which I have clicked to display the DialogFramework has stopped to work.

I can click on another icon just below and that works. But when I come back to the Form, the already clicked icons seem to be locked !

The Confirm dialog HTML code I use is :

Code: Select all

<p:dialog header="Continue without saving data" widgetVar="dlgConfirm" modal="true" height="100">
            <p:panel>
                <h:outputText value="Some fields has been modified and are NOT saved. Will you continue without saving them ?" />
            </p:panel>    
            <p:commandButton 
                value="Yes" 
                type="button"
                styleClass="ui-confirmdialog-yes" 
                icon="ui-icon-check" 
                onclick="PF('dlgConfirm').hide();HideDialogContext();"
                />
            <p:commandButton  
                value="No" 
                type="button" 
                styleClass="ui-confirmdialog-no" 
                icon="ui-icon-close" 
                onclick="PF('dlgConfirm').hide();ShowDialogContext();"
                />
</p:dialog>   
The HTML code for clickable icon is

Code: Select all

<p:commandButton
    class="show-text-editor"
    icon="ui-icon-pencil"
    onclick="showTextEditorWidget(this);"
    />
The Javascript code for HideDialogContext() is

Code: Select all

        function HideDialogContext()
            {
            var wgDialog = jQuery(".ui-dialog.ui-overlay-visible",window.parent.document)
                .each
                    (function(nIndex)
                        {
                        var sWidgetName = $(this).attr('data-widgetvar');
                        var wgDialog = window.parent.PF(sWidgetName);
                        wgDialog.jq.hide();
                        wgDialog.disableModality();
                        });
            }
You can see that I call disableModality() function to unprotect Form. Without this function, original Form is locked.

The Javascript function for "showTextEditorWidget(this); is

Code: Select all

<p:column headerText="Modify" style="width:2ch;">
    <p:commandButton
        icon="ui-icon-pencil"
        styleClass="rowButton"
        ajax="true"
        actionListener="#{oPostLabCtcController.onEditCtcRow(ctci)}"
        >

        <p:ajax
            event="dialogReturn"
            listener="#{oPostLabCtcController.updateTable()}"
            update=":FormSession"
            immediate="false"
            />
Why MODIFY icon (or button) is not more clickable ?

Using wgDialog.jq.hide(); and wgDialog.disableModality() is perhaps a bad idea because dialogReturn() event is not called !

How can I solve this last problem ?
PrimeFaces 6.2.4
Mojarra 2.2.13
Glassfish 4.1

schlebe
Posts: 212
Joined: 25 Sep 2015, 13:32
Location: Colmar-Berg (Luxembourg)

28 Feb 2018, 16:06

I have found a solution in talking on GITHUB on https://github.com/primefaces/primefaces/issues/3373

I will make a Paste-Copy of last response.

@cnsgithub: I have used your technics, and I have replaced

Code: Select all

wgDialog.hide = function() { displayConfirmDialog();
where wgDialog is the DialogFramework widged variable.

by ...

Code: Select all

wgDialog.closeIcon.off('click'); 
wgDialog.closeIcon.click(function() { displayConfirmDialog(); });
this work well,

But I have the same problem that I have with icon/button that keep blocked and unclickable !

Sorry, I have forgotten to change the method call to close the DialogFramework.

Before, I called

Code: Select all

wgDialog.jq.hide();
wgDialog.disableModality();
and now I can call directly

Code: Select all

wgDialog.hide();
When I do that, DialogFramework is correctly closed ... and button in original Form call be clicked a new time.

The trick with your proposal is that Dialog.hide() function is not modified and that I can use it normally when I will hide Dialog.

Thanks for your help.

Now I have a complete solution to intercept DialogFramework before the dialog is closed to display a Confirmation <p:dialog> to advise user that some changes has not been saved.
PrimeFaces 6.2.4
Mojarra 2.2.13
Glassfish 4.1

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: Google [Bot] and 20 guests