JSF Login Example By Using Component Instance Binding

JavaBeans are used to associate the UI components. This backing bean (JavaBean) contains properties that are bound to either component value or component instance. Both types of binding requires use of Expression Language (EL) syntax.

JSF Login Example By Using Component Instance Binding

JSF Login Example By Using Component Instance Binding

        

JavaBeans are used to associate the UI components. This backing bean (JavaBean) contains properties that are bound to either component value or component instance. Both types of binding requires use of Expression Language (EL) syntax. A component instance can be bound to the bean property by referencing the property in the "binding" attribute of the tag associated with the component. But we have to take care of one fact that the property of the bean must accept and return the same component type as the instance of the bound component. In this component instance binding the property holds the local value of the component while value binding holds its modal value which is updated with the local value of the component. Here is an example that will make you clear this fact.

Code Description : This application is same as previously explained in "JSF simple login application" tutorial. But here working procedure is different. Code for all the pages have been given below :

login.jsp :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

<f:view>
<html>
<head><title>JSF Login Example By Using Component Binding</title></head>

<body>
<h:form>
<table>
<tr>
   <td><h:outputText value="Enter Login ID: " /></td>
   <td><h:inputText id="loginname"
   binding="#{LoginWithCompBinding.loginname}" /></td>
</tr>
<tr>
   <td><h:outputText value="Enter Password: " /></td>
   <td><h:inputSecret id="password" 
   binding="#{LoginWithCompBinding.password}" /></td>
</tr>
<tr>
   <td>&nbsp;</td>
  <td><h:commandButton value="Login"
  action="#{LoginWithCompBinding.CheckValidUser}" /></td>
</tr>
</table>
</h:form>
</body>
</html>
</f:view>

 resultforfail.jsp : 

Login Failed!

resultforsuccess.jsp : 

Login Successfully done!

loginWithCompBinding.java(JavaBean) : 

Here getter method getLoginname() returns instance of type HtmlInputText because loginname property is associated to the instance of component of this type i.e. "HtmlInputText". In the same way setter method setLoginname() takes parameter of HtmlInputText type because of the same reason explained above. These steps are necessary for each component using component instance binding. 

package roseindia;

import javax.faces.component.html.HtmlInputSecret;
import javax.faces.component.html.HtmlInputText;

public class LoginWithCompBinding{
HtmlInputText loginname;
HtmlInputSecret password;

public LoginWithCompBinding(){}

public String CheckValidUser(){
   if(loginname.getValue().equals("administrator") &&
  password.getValue().equals("admin"))
   return "success";
   else
   return "fail";
}

public HtmlInputText getLoginname(){
  return loginname;
}

public void setLoginname(HtmlInputText loginname){
  this.loginname = loginname;
}

public HtmlInputSecret getPassword(){
  return password;
}

public void setPassword(HtmlInputSecret password){
   this.password = password;
}
}

 Rendered Output : This is the first screen appeared to the user.

If the user fills the below entries 

then the screen below appears

otherwise this screen appears to the user indicating the failure of the login process.

faces-config.xml :

 <?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC
"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
"http://java.sun.com/dtd/web-facesconfig_1_1.dtd">

<faces-config>
  <managed-bean>
  <managed-bean-name>LoginWithCompBinding</managed-bean-name>
  <managed-bean-class>roseindia.LoginWithCompBinding</managed-bean-class>
  <managed-bean-scope>request</managed-bean-scope>
  </managed-bean>
   <navigation-rule>
  <from-view-id>/pages/login.jsp</from-view-id>
   <navigation-case>
   <from-action>#{LoginWithCompBinding.CheckValidUser}</from-action>
   <from-outcome>success</from-outcome>
   <to-view-id>/pages/resultforsuccess.jsp</to-view-id>
  </navigation-case>
  <navigation-case>
   <from-action>#{LoginWithCompBinding.CheckValidUser}</from-action>
   <from-outcome>fail</from-outcome>
   <to-view-id>/pages/resultforfail.jsp</to-view-id>
  </navigation-case>
  </navigation-rule> 
</faces-config>

 Download this example.