JSF 2 OutputScript Example

JavaServer Faces (JSF 2) provides a number of user interfaces components that cover the most common requirements, one of the most important component is a <h:outputScript/> component. You can include a JavaScript fragment of code in your views using the typical link tag. JavaServer Faces 2 provides you a resources newly concept that’s ever provided before; it is now possible to include your JavaScript using <h:outputScript/> tag. You can place script files into a resources directory in the root of your web application. Sub directories of this directory are called libraries, you can create any libraries that you would.

Also Read:

1. JSF View


<html xmlns="http://www.w3.org/1999/xhtml"
	<h:outputScript library="js" name="javascript.js"></h:outputScript>
			<h:outputText value="JavaBeat JSF 2.2 Examples" />
			<h:outputText value="OutputScript Example" />
		<h:commandLink value="Say Hello" onclick="sayHello();"/>

2. Java Script Code


function sayHello(){
alert("Hello JavaBeat !");

3. The Directory Structure

For a proper use of <h:outputScript/> you have to structure your directories as you would be seeing in the snapshot below.

JSF 2 outputScript Example 2

4. The Deployment Descriptor (web.xml)


<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	id="WebApp_ID" version="2.5" metadata-complete="true">
		<description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-name>Faces Servlet</servlet-name>

5.  JSF 2 outputScript Demo

The below snapshot shows you a running example using of outputScript component.

JSF 2 outputScript Example 2



About Amr Mohammed