[wp_ad_camp_5]

This post demonstrates how to perform validation on required fields in JSF.

Requirements

Stuff used in this post.

JSF 2.2
- javax.faces-2.2.8.jar
JDK 8

JSF Managed Bean

This is our managed bean is a Java class annotated with @ManagedBean. The 3 important piece of codes here are:

@ManagedBean
Default public no-arg constructor
Setter and getter methods

For this post, the following is our Java class.

[wp_ad_camp_4]

package com.turreta.jsf.bean;

import javax.faces.bean.ManagedBean;

@ManagedBean
public class Employee {
	
	private String firstName;
	private String lastName;
	private String email;
	
	public Employee() {}
	
	public String getFirstName() {
		return firstName;
	}
	public void setFirstName(String firstName) {
		this.firstName = firstName;
	}
	public String getLastName() {
		return lastName;
	}
	public void setLastName(String lastName) {
		this.lastName = lastName;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
}

package com.turreta.jsf.bean;

import javax.faces.bean.ManagedBean;

@ManagedBean

public class Employee {

private String firstName;

private String lastName;

private String email;

public Employee() {}

public String getFirstName() {

return firstName;

}

public void setFirstName(String firstName) {

this.firstName = firstName;

}

public String getLastName() {

return lastName;

}

public void setLastName(String lastName) {

this.lastName = lastName;

}

public String getEmail() {

return email;

}

public void setEmail(String email) {

this.email = email;

}

Registration Page – Request

The first page is where users input employee information. Hit Submit button to validate data and finally register an employee.

[wp_ad_camp_3]

<!DOCTYPE html>
<html lang="en"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core">
	
	<h:head>
		<title>Employee Registration Form</title>
		<style>
			.form-error {color:red}
		</style>
	</h:head>
	<h:body>
		<h:form>		
			<h:messages styleClass="form-error"/>
		
			<table>
				<tr>
					<td>First Name:</td>
					<td><h:inputText value="#{employee.firstName}" label="First Name"/></td>
				</tr>
				<tr>
					<td>Last Name:</td>
					<td><h:inputText value="#{employee.lastName}" required="true" label="Last Name"/></td>
				</tr>
				<tr>
					<td>Email:</td>
					<td><h:inputText value="#{employee.email}" required="true" label="Email"/></td>
				</tr>
			</table>
			<h:commandButton value="Submit" action="registration_response"/>
		</h:form>
	</h:body>
</html>

<!DOCTYPE html>

<html lang="en"

xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:f="http://xmlns.jcp.org/jsf/core">

<h:head>

<title>Employee Registration Form</title>

<style>

.form-error {color:red}

</style>

</h:head>

<h:body>

<h:form>

<h:messages styleClass="form-error"/>

<table>

<tr>

<td>First Name:</td>

</tr>

<tr>

</tr>

<tr>

<td>Email:</td>

</tr>

</table>

<h:commandButton value="Submit" action="registration_response"/>

</h:form>

</h:body>

</html>

Second Page – Response

This page displays the registered employee details

[wp_ad_camp_2]

<!DOCTYPE html>
<html lang="en"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
	<h:head>
		<title>Employee Registration Form - Response</title>
	</h:head>
	<h:body>
		Employee Registered!
		
		<table>
			<tr>
				<td><b>Last Name:</b></td>
				<td>#{employee.lastName}</td>
			</tr>
			<tr>
				<td><b>First Name:</b></td>
				<td>#{employee.firstName}</td>
			</tr>
			<tr>
				<td><b>Email:</b></td>
				<td>#{employee.email}</td>
			</tr>			
		</table>		
	</h:body>
</html>