使用JavaScript删除P：confirmDialog？

Question

I have created an confirm dialog using primefaces and the coding is below.

<p:confirmDialog id="exportDialog" styleClass="export-dialog" rendered="#{Controller.renderExport == true}"
    visible="#{Controller.renderExport == true}" header="Export" message="Do you want to export data ?"
    closable="false">
    <h:commandLink onclick="return closedialog()" value="Export All" action="#{Controller.exportAll}" " styleClass="export"/>
</<p:confirmDialog> 

when I click the button inside dialog the dialog, it should close the dialog and an excel file excel needs to be downloaded.

To close the dialog i am calling the closedialog() function. the close dialog function is as below.

function closedialog(){         
    $("#exportDialog").remove();
    $("#exportDialog_modal").remove();
}

the dialog box got disappeared but i am unable to click the textbox behind the popup. but i am able to click buttons. am I doing anything wrong please help.

Answer 1

Assign a 'widgetVar' to your <p:confirmDialog like this:

<p:confirmDialog widgetVar="myConfirm"....

Then to close it use the hide() command in your js code like this: myConfirm.hide()

I took a deeper look at your question,

You need to replace the

onclick="return closedialog()"

with

onclick="myConfirm.hide(); return false;"

The purpose of the return false; is to prevent form submition