Calling javascript based on return value of action controller method in JSF?

Question

I have written an action method in backing bean which is invoked by action attribute of command button. On successful execution it returns 'null' otherwise it returns 'error'. What I need to is, I want to display an appropriate message in javascript dialog box based on return value of action method. Can anyone please tell me how to achieve that?

Answer 1

Since you're using JSF 2 you can use some <f:ajax/> magic here. Nest one of this tags inside your command button:

<h:commandButton id="yourCmdButton" action="#{yourBean.yourMethod}">
    <f:ajax render="hiddenComponent" onevent="displayMessage">
</h:commandButton>

yourMethod should update the value you mention to a field that's bound to an <h:inputHidden/> with id="hiddenComponent" and, through ajax, the component will be updated. Then after that, the displayMessage javascript function will be called (onevent defines a callback javascript function for the associated jax request) and there you will have to fetch the value of that component and display a message if necessary.

On the other hand, you can make use of the so called Flash Scope, tough it isn't a scope per se. It can be accessed in different ways either by injecting it into the bean:

@ManagedProperty("#{flash}")
private Flash flash;

//The setter is required
public void setFlash(Flash newFLash) {
    flash = newFlash;
}

or by obtaining it directly:

Flash jsfFlash = FacesContext.getCurrentInstance().getExternalContext().getFlash();
jsfFlash.put("errorMsg", "error");
//Or jsfFlash.put("errorMsg", null) if there's no error.

The Flash is a Map that allows the survival of a parameter one step ahead of a request, allowing the native implementation of a POST - Redirect - GET pattern without almost no effort on your part.

On the page, you can access the flash directly and render a message if the flash doesn't contain the error attribute:

<h:panelGroup rendered="#{flash.errorMsg != null}">
    <p>
        Well... it seems an error occured...
    </p>
</h:panelGroup>

Remember that, should your flash key string include a period for some reason, you'll have to use this nomenclature instead:

<h:panelGroup rendered="#{flash['error.message'] != null}">

Just remember to rerender a parent <h:panelGroup/> for that component (through the use of the <f:ajax/> tag without an onevent javascript callback function). About rerendering the parent, you can't rerender a conditionally rendered component directly in JSF, so you'll end up with something like this:

<h:panelGroup id="messageParentGroup">
    <h:panelGroup rendered="#{flash.errorMsg}">
        ...

<h:commandButton ...>
    <f:ajax render="messageParentGroup"/>
</h:commandButton>

Also, take into account the context of the components. You might have to define a full path for that component and not a relative one.

As a side note, why aren't you using JSF's validation? Either by using a validator method or a fully implemented validator alongside an <h:messages/> component would be better and you avoid the contamination of your form values (since the validator kicks in and prevents the SetValues among other Phases from happening).

Answer 2

You can use the RequestContext.getCurrentInstance().execute("myfunction()") method inside your backing bean. It lets you execute client side javascript code. Unfortunately this is only available (afaik) in Primefaces.