Over a million developers have joined DZone.

Populating a JS load function with JSF values

· Java Zone

Microservices! They are everywhere, or at least, the term is. When should you use a microservice architecture? What factors should be considered when making that decision? Do the benefits outweigh the costs? Why is everyone so excited about them, anyway?  Brought to you in partnership with IBM.

As you know, when a web page is loaded, the code on the page is generally processed from the top down. JS code can interfere in this top-down order in many ways, and the onload function (specified on the body tag) is one of these possibilities. When the page is loaded, the browser will stop at the onload function and will execute the indicated script. In this recipe,you will see how to populate that script with JSF values, provided by a managed bean.

Getting ready
We have developed this recipe with NetBeans 6.8, JSF 2.0, and GlassFish v3. The JSF 2.0 classes were obtained from the NetBeans JSF 2.0 bundled library.

How to do it...
The onload function calls our JS function, named calledOnLoad. Our function will retrieve some JSF values from a managed bean. Here it is how it will do this:

<?xml version='1.0' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml"
<title>Passing parameters on HTTP GET</title>
<script type="text/javascript" language="javascript">
function calledOnLoad(){
var p_1 = '<h:outputText value="#{bean.param_1}"/>';
var p_2 = '<h:outputText value="#{bean.param_2}"/>';
var ot = document.getElementById("formId:textId");
ot.textContent="Parameters from bean are:"+p_1+" and " + p_2;
<h:body onload="calledOnLoad();">
<h:form id="formId">
<h:outputText id="textId" value=""/>

The managed bean is:
package bean;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

public class Bean {

private String param_1 = "Me";
private String param_2 = "You";

public String getParam_1() {
return param_1;

public void setParam_1(String param_1) {
this.param_1 = param_1;

public String getParam_2() {
return param_2;

public void setParam_2(String param_2) {
this.param_2 = param_2;

How it works...
The secret of this recipe is in this line:
var p_1 = '';

Notice that JS knows how to parse this line to extract the JSF value, instead of assigning a verbatim text to the p_1 variable.

From http://e-blog-java.blogspot.com/2011/04/populating-js-load-function-with-jsf.html

Discover how the Watson team is further developing SDKs in Java, Node.js, Python, iOS, and Android to access these services and make programming easy. Brought to you in partnership with IBM.


Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}