Question

How I can show dialog before any f:ajax action.
I have code as following:

    <h:commandButton  value="Create Project" styleClass="greyishBtn submitForm" action="#{projectController.delete}">
          <f:ajax execute="@form"  onevent="function(data) {createProjectEventHandler(data);}" render=":tblProject txtNewProjectName txtNewProjectStartDate taNewProjectDesc"/>
    </h:commandButton>

This code works fine, but I need a confirm dialog before call delete action, I tried onevent, but it only have begin, success and complete events, what I need is confirm dialog before ‘begin’ event.

Any idea?

Thanks in advance.

Answer 1

Before the ajax even starts you can cancel it (ajax) or the submit action itself by using onclick="return false" in the <h:commandButton itself…

So the simplest way it to use js confirm("Delete?") dialog with onclick

<h:commandButton  onclick="return confirm('Delete?');" value="Create Project" styleClass="greyishBtn submitForm" action="#{projectController.delete}">
    <f:ajax execute="@form"  onevent="function(data) {createProjectEventHandler(data);}" render=":tblProject txtNewProjectName txtNewProjectStartDate taNewProjectDesc"/>
</h:commandButton>

---

A more advanced way could be found here jQuery UI confirm dialog not returns true/false it uses jQuery dialog with JSF