Time for action – executing JavaScript using RequestContext.execute()

We will now take a look at how to execute client-side JavaScript code from server-side code by performing the following steps:

  1. Create a form with a Dialog component using the following code: 
    <h:form id="form1">
  <h:panelGrid columns="2">
    <h:outputLabel value="EmailId" />
    <p:inputText id="emailId" value="#{requestContextController.emailId}"/>
    
    <p:commandButton id="submitBtn" value="Submit" actionListener="#{requestContextController.handleSubmit}" />
  </h:panelGrid>

  <p:dialog header="Information" widgetVar="dlg" closeOnEscape="true" modal="true">
    You have Entered : #{requestContextController.emailId}
  </p:dialog>
</h:form>
  2. In the action handler method, execute the JavaScript call, dlg.show(), to display a dialog widget using the RequestContext.execute() method. Use the following code for the same: 
    public void handleSubmit(ActionEvent ae)
{
  RequestContext context = RequestContext.getCurrentInstance();
  context.update("form1");
  context.execute("dlg.show()");
}

What just happened?

When the Submit button is clicked, we have updated the form and executed the JavaScript code dlg.show() which displays a dialog widget.

Adding AJAX callback parameters

Sometimes, we may need to execute an AJAX request and perform some UI updates based on the callback parameters received from managed bean methods.

Let us see how we can add a basic parameter and a Plain Old Java Object (POJO), which will be serialized into JSON as a callback parameter.

上一章目录下一章