Create Tag Library Descriptor (TLD) File

In this example, we learn how to create library descriptor file in your project. Developers can group together tags of similar or related functionality. For this, a tag library descriptor file (TLD file) is used to describe the tag extensions and relate them to their java classes. TLD files are written in XML notation. Follow these steps to create the file:

1. Go to project option and right click on your project and select new -> Other in the project window, as shown in figure.

2. Select Web under Categories, and select Tag Library Descriptor under File Types, as shown in figure. Click Next.

3. New Tag Library Descriptor dialog appears next. Enter TLD Name as image, as shown in Figure and click Finish.

4. Now, image.tld file is added in the project window under WEB-INF / tlds. The source code given below:

image.tld

http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee web-jsptaglibrary_2_0.xsd"> 1.0 <short-name>imageshort-name> /WEB-INF/tlds/image

Source Code of image.tld

read more “Create Tag Library Descriptor (TLD) File”

Declaring the Bean class in the faces-config.xml file

This example illustrates how to define the bean in the faces-config.xml file with element. Its child element can be used to provide name for the bean. This name can be referred through out the application to access the bean. Its original class name is specified in another child element . child element is used to specify the property value, specifies the property name and specifies its value.

The source code of the faces-config.xml file is as follows:

xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"> SimpleLogin class>roseindia.SimpleLoginclass> request /login.jsp case> #{LoginForm.CheckValidUser} success /success.jsp case> case> #{LoginForm.CheckValidUser} fail /fail.jsp case>

Download Source Code

read more “Declaring the Bean class in the faces-config.xml file”

Creating Bean Class In JSF using NetBeans

This example illustrates how to create the Bean Class. This is also called the Backing Bean Class. This bean class is used to store the values of the form components. It contains setter and getter methods for the properties to set and get the values. The JSF application can contain one or more backing beans. The following steps are used to create the bean class in the JSF application:-

Step1:- Go to project window and right click on project - select New - and select Java Package...

Step 2:- Enter Package Name and click Finish.

Step 3:- Right click on package - select New and select Java Class...

Step 4:- Enter Class Name - click Finish Button.

package roseindia; public class LoginForm { String loginid; String password; public String getLoginid(){ System.out.println("111111111111"+loginid); return loginid; } public void setLoginid(String loginid){ System.out.println("111111111111!!!!!!!!!!!"); this.loginid = loginid; } public String getPassword(){ System.out.println("222222222222"+password); return password; } public void setPassword(String password){ System.out.println("222222222222!!!!!!!!!"); this.password = password; } public String CheckValidUser(){ System.out.println("sandeep kumar suman"); if(loginid.equals("sandeep15284") && password.equals("sandeep")){ System.out.println("sandeep"); return "success"; } else{ return "fail"; } } }

Now the class is created and will be opened for you to modify the class.

Here is a Bean Class named LoginForm.java, which can be used for example purpose.

Download Source Code

read more “Creating Bean Class In JSF using NetBeans”

Adding Navigation in JSF Application

This tutorial explains how to navigate from one jsp page to another jsp in JSF application. The page navigation in the JSF framework is controlled by the faces-config.xml. This file contains one or more navigation cases. You can map action from the commandButton to success.jsp and fail.jsp. Steps to navigate the jsp form using NetBeans IDE.

Step 1:- In the Projects window, double-click faces-config.xml to open the file in the Source Editor. In the toolbar above the file, click XML to display the file in plain XML.

Step 2:- Right-click anywhere in the file and choose JavaServer Faces > Add Navigation Rule. Type /login.jsp in the Rule from View field and optionally enter a description of the rule as figure below:

Step 3:- Right-click anywhere in the file and choose JavaServer Faces > Add Navigation Case. Type /login.jsp in the Form View and type success in Form Outcome and type /success.jsp in To View as figure below:

xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"> SimpleLogin class>roseindia.SimpleLoginclass> request /login.jsp case> #{LoginForm.CheckValidUser} success /success.jsp case> case> #{LoginForm.CheckValidUser} fail /fail.jsp case>

As per your requirement give another navigation rule. The faces-config.xml structure is as follows:

Download Source Code

read more “Adding Navigation in JSF Application”

Binding the Form Elements With the Bean Properties

This example illustrates how to bind the value of the component to the property of the bean or to refer method of the bean from component tag, Expression Language (EL) "#{ }" syntax is used for this purpose. For example, #{BeanName.propertyName} can be used to bind the value of the component to the property "propertyName" of the bean "BeanName". #{BeanName.methodName} can be used to refer method "methodName()" of the bean "BeanName", when button is clicked. When page is rendered, the values for the components are accessed using getter methods of the related properties and when the form is submitted by clicking on button the appropriate setter methods are called to set the values to the beans properties and the method methodName() is called on button click. Source code of login.jsp is as follows: <%@page contentType="text/html" pageEncoding="UTF-8"%> "http://www.w3.org/TR/html4/loose.dtd"> <%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %> <%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %> In this source code we have associated values of the UIcomponents to the backing bean's properties. The bean's properties loginid and password are bound to the input components. When the user fills values in these components and submit the form, these values are stored in the properties of the bean. So when they are again bound with the component, stored values are used. For example, in "success.jsp" page we have again used these properties values so it considers the values filled in previous page. Command button component's action is associated with CheckValidUser() method of the Bean class. This method returns a String value either "success" or "fail". This value is set to the action attribute of the commandButton tag. This button works according to the returned value and the navigation rules specified in the "faces-config.xml" file. success.jsp <%-- Document : success Created on : Sep 11, 2008, 11:49:49 AM Author : sandeep kumar suman --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> "http://www.w3.org/TR/html4/loose.dtd"> Congratulations! fail.jsp <%-- Document : fail Created on : Sep 11, 2008, 1:45:14 PM Author : sandeep kumar suman --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> "http://www.w3.org/TR/html4/loose.dtd"> Please try again! Download Source Code

read more “Binding the Form Elements With the Bean Properties”

Creating Login Page In JSF using NetBeans

This example illustrates you how to create a login form in JSF using NetBeans. To create the jsp page in NetBeans:

1. Right click on Web Pages under your project.
2. Go to New- JSP and click.
3. Enter JSP File Name (login, for this example) when New JSP File window appear.
4. Click Finish. Then the page will be created and listed as below:

Write your code for login. In this example, login.jsp is created. The code is given below:

Source Code of login.jsp

<%-- Document : login Created on : Sep 10, 2008, 1:45:52 PM Author : sandeep kumar suman --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> "http://www.w3.org/TR/html4/loose.dtd"> <%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %> <%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %>

Description of all tags which is used in this program:

tag is used to create top level view and is a container for all JSF component tags on a page.
tag creates html form.
tag creates html table with specified number of columns.
tag is used for creating component for displaying formatted output as text.
tag is used to creates text input control (single line).

Run the program just by right click on login.jsp page and select run. The following output will be displayed on browser:

Download Source Code

read more “Creating Login Page In JSF using NetBeans”

Creating a Web Application with the JSF Framework

This example illustrates how to add JSF supporting file while creating a new web application project. In the previous example we have already explained how to create jsp pages in the project, in this example we are showing how to creates a project template for the entire application. You can see the logical structure of project by just pressing the ctrl+1 button. If you expand the Configuration file you will see faces-config.xml file is already created. This faces-config.xml file controls all behavior of JSF component in your application.

read more “Creating a Web Application with the JSF Framework”

JSF Hello World

In this example, we will be developing JSF Hello World example application in NetBeans IDE. This example illustrates how to print hello world in JSF application using NetBeans IDE. NetBeans IDE provides simple way to create and test web applications. Its provides standardized directory structure to create the project artifacts such as jsp pages, xml pages, java classes etc.

Steps to create JSF Hello World Example:

1. Go to your project and right click on "Web Pages" folder.
2. The select "New" option and and click on "JSP..." as shown below.

Creating new JSP page in NetBeans IDE

Now it will open a jsp page where you can write your code. For this example, we will use code given in HelloWorld.jsp as below.

Source code of HelloWorld.jsp

<%-- Document : HelloWorld Created on : Sep 9, 2008, 8:03:01 PM Author : sandeep --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> "http://www.w3.org/TR/html4/loose.dtd"> <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%> <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

Now you need to run the application to see the output for the code written above. The following steps can be used to run the JSF application in NetBeans IDE.

• Right click on the HelloWorld.jsp page.
• Select Run File from the appeared menu.
• The Run File will start the server deploy the application and display the output on the web browser.

OR, Run the above file by using Shift + f6 keys on keyboard. The output is shown on the browser like below:

Download Source Code

read more “JSF Hello World”

Create JSF Application Using NetBeans IDE

read more “Create JSF Application Using NetBeans IDE”