Home » Enterprise Java » jsf » TextBox Example with JSF 2.0

About Thodoris Bais

Thodoris Bais
Thodoris is an Oracle Certified Associate Java Programmer and currently works as a Junior Software Developer, for Intrasoft International S.A. He holds a diploma at Informatics & Telecommunications Engineering and is interested in continuous development.

TextBox Example with JSF 2.0

In this example, we are going to demonstrate a simple application, which purpose is to transfer data inserted to a page’s textbox (in our case, a sample username), to another page. While on JSF, we can use the following tag, in order to render an HTML input of a textbox: <h:inputText/>.

To get the meaning, imagine that the fore-mentioned xhtml’s tag is equal to HTML’s <input type="text">. So, let’s get into the full example.
 
 
 
 

1. Managed Bean

Here is our simple Managed Bean, which handles the username.

UserBean.java

package com.javacodegeeks.enterprise.jsf.textbox;

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@SessionScoped
public class UserBean implements Serializable{

	private String username;

	public String getUsername() {
		return username;
	}

	public void setUsername(String username) {
		this.username = username;
	}

}

2. Our Pages

Like we said, we need two separate pages; the first will get the user’s input and the second will render it back. Let’s have a look at them:

index.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"    
      xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
    	<title>JSF TextBox Example</title>
    </h:head>
    <h:body> 
    	<h1>JSF 2.0 TextBox Example</h1>

    	<h:form>
    		<h:inputText value="#{userBean.username}" />
    		<h:commandButton value="Submit" action="response" />
    	</h:form>
    </h:body>
</html>

response.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"    
      xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
    	<title>JSF TextBox Example</title>
    </h:head>
    <h:body> 
    	<h1>JSF 2.0 TextBox Example - Response Page</h1>

    	Welcome, <h:outputText value="#{userBean.username}" /> !
    </h:body>
</html>

3. Demo

Now that we got our two view pages set up, let’s have a quick demo, by trying to access the following URL: http://localhost:8080/TextboxJSF

textboxJSF1

And after clicking the button, our response page:

textboxJSF2

This was an example of TextBox in JSF 2.0. You can also download the source code of this example: TextboxJSF

(No Ratings Yet)
Start the discussion Views Tweet it!

Do you want to know how to develop your skillset to become a Java Rockstar?

Subscribe to our newsletter to start Rocking right now!

To get you started we give you our best selling eBooks for FREE!

 

1. JPA Mini Book

2. JVM Troubleshooting Guide

3. JUnit Tutorial for Unit Testing

4. Java Annotations Tutorial

5. Java Interview Questions

6. Spring Interview Questions

7. Android UI Design

 

and many more ....

 

Receive Java & Developer job alerts in your Area

 

Leave a Reply

avatar
  Subscribe  
Notify of