The h:commandButton component is an important one among those components that are provided by JSF. This component does render an HTML submit button that work as a simple <input type=”submit”/>. JSF 2 does enhance the h:commandButton by allowing the command to invoke an associated action by passing a parameters for it. The main attribute of the h:commandButton is an action attribute that accepts a method-binding expression for a backing bean action (method) to be invoked when the user has clicked on the button. The method-binding expression has the following roles to be accepted as a proper action.
- The defined method (action) in the backing bean should have a public access modifier.
- The defined method (action) in the backing bean should have a String as returned type. (This string token will be consumed by the JavaServer Faces Navigation Handler).
- Starting with JSF 2.0, the defined method can accept a parameter values in the method signature, this feature is useful for providing parameters to the actions of buttons and links. When a method reference is evaluated, the parameters are evaluated and passed to the method.
The h:commandButton and h:commandLink are the primary components for navigating within a JSF application, when a button or link is clicked (activated), a POST request sends the form data back to the server and the JSF framework lifecycle has started. The main difference between h:commandButton and h:commandLink that the latter provides a predefined code at the onclick JavaScript attribute
Also Read:
1. Managed Bean
LoginBean.java
package net.javabeat.jsf; import javax.faces.bean.ManagedBean; import javax.faces.bean.SessionScoped; @ManagedBean @SessionScoped public class LoginBean { private String username = ""; private String password = ""; private String authority = ""; public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } public String getAuthority() { return authority; } public void setAuthority(String authority) { this.authority = authority; } public String login(String type){ this.authority = type; if(this.username.isEmpty() == false && this.username.equalsIgnoreCase("Josha") && this.password.isEmpty() == false && this.password.equals("Josha1@#$")){ return "success"; } return "failure"; } }
2. The Views
login.xhtml
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h:form> <h1> <h:outputText value="JavaBeat JSF 2.2 Examples" /> </h1> <h2> <h:outputText value="CommandButton Example" /> </h2> <table> <tr><td>Enter Your Username : </td><td><h:inputText id="username" value="#{loginBean.username}"/></td></tr> <tr><td>Enter Your Password : </td><td><h:inputSecret value="#{loginBean.password}"/></td></tr> <tr><td colspan="2"><h:commandButton value="Login" action="#{loginBean.login('Admin')}"/></td></tr> </table> <br/> </h:form> </html>
success.xhtml
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h:form> <h1> <h:outputText value="JavaBeat JSF 2.2 Examples" /> </h1> <h2> <h:outputText value="CommandButton Example" /> </h2> Welcome <h:outputText value="#{loginBean.username}"/> <br/> You're Logged in By <h:outputText value="#{loginBean.authority}"/> Authority <br/> </h:form> </html>
failure.xhtml
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h:form> <h1> <h:outputText value="JavaBeat JSF 2.2 Examples" /> </h1> <h2> <h:outputText value="CommandButton Example" /> </h2> Login Failure, Please Try Again ! <br/> </h:form> </html>
3. The Deployment Descriptor (web.xml)
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" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5" metadata-complete="true"> <context-param> <description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>client</param-value> </context-param> <context-param> <param-name>javax.faces.application.CONFIG_FILES</param-name> <param-value>/WEB-INF/faces-config.xml</param-value> </context-param> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.xhtml</url-pattern> </servlet-mapping> <listener> <listener-class>com.sun.faces.config.ConfigureListener</listener-class> </listener> </web-app>
4. JSF 2 CommandButton Demo
The below snapshots demonstrates the using of h:commandButton with JSF 2, in that the action represented by the h:commandButton will be used for sending a parameter determines the type of authority that the user has logged with. The h:commandButton does associate with the a navigation handler, so a navigation to a proper view will be happened in case the login process has succeeded or failed.
[wpdm_file id=13]