Calling A JavaScript Function From Managed Bean

Is there a way to call (execute) a JavaScript function from managed bean in JSF? If that's relevant, I'm also using PrimeFaces.

Solution 1:

PrimeFaces 6.2+

Use PrimeFaces#executeScript():

public void submit() {
    // ...
    PrimeFaces.current().executeScript("alert('peek-a-boo');");
}

NOTE: works only when submit() is invoked by Ajax.

PrimeFaces 6.2-

Use RequestContext#execute():

public void submit() {
    // ...
    RequestContext.getCurrentInstance().execute("alert('peek-a-boo');");
}

NOTE: works only when submit() is invoked by Ajax.

JSF 2.3+

Use PartialViewContext#getEvalScripts():

public void submit() {
    // ...
    FacesContext.getCurrentInstance().getPartialViewContext().getEvalScripts().add("alert('peek-a-boo');");
}

NOTE: works only when submit() is invoked by Ajax.

OmniFaces

Use Ajax#oncomplete().

public void submit() {
    // ...
    Ajax.oncomplete("alert('peek-a-boo');");
}

NOTE: works only when submit() is invoked by Ajax.

JSF 2.2-

Best what you can do is to set the desired script as a bean property and conditionally render a <h:outputScript> component when the bean property is not empty.

<h:commandButton ... action="#{bean.submit}" />
<h:outputScript rendered="#{not empty bean.script}">#{bean.script}</h:outputScript>

public void submit() {
    // ...
    script = "alert('peek-a-boo');";
}

In case you're submitting the form by Ajax, don't forget to wrap the <h:outputScript> in another component and ajax-update it instead. See also Ajax update/render does not work on a component which has rendered attribute.

<h:commandButton ... action="#{bean.submit}">
    <f:ajax execute="@form" render="script" />
</h:commandButton>
<h:panelGroup id="script">
    <h:outputScript rendered="#{not empty bean.script}">#{bean.script}</h:outputScript>
</h:panelGroup>

Solution 2:

Depending on which version of Primefaces you're on you can use RequestContext.execute("{js here}");

From the Primefaces 3.4 documentation:

RequestContext provides a way to execute javascript when the ajax request completes, this approach is easier compared to passing callback params and execute conditional javascript. Example below hides the dialog when ajax request completes;

Code

public void save() {
  RequestContext requestContext = RequestContext.getCurrentInstance();  
  requestContext.execute("dialog.hide()");
}

Solution 3:

Closest thing in Primefaces is;

http://www.primefaces.org/showcase/ui/callbackParams.jsf

Having said there is also an enhancement in 3.0;

http://code.google.com/p/primefaces/issues/detail?id=1342

Solution 4:

You can't simply.

Managed Bean works on server and JavaScript on browser.

You can make conditionally invoke JavaScript depending on the value set in managedbean

Solution 5:

In general, Java provides an API to evaluate a string using a scripting engine. This can be accomplished by javax.script.ScriptEngine and javax.script.ScriptEngineManager classes.

I am not entirely sure what your situation is, but if you can pass the javascript as a string to the managed bean, you could probably use Java scripting API to run the javascript on the server side.

For more information, check out this link: http://docs.oracle.com/javase/6/docs/technotes/guides/scripting/programmer_guide/index.html