14 total views, 14 views today

JSF CommandButton Example

The h:commandButton is used widely in HTML Form Submission. It uses HTTP POST method while submitting the form. It invokes the action or  actionlistener method present in the commandButton tag.

The h:commandButton renders like below in the browser

In this section, I have created an HTML FORM with two input fields and a commandButton.The JSF commandbutton uses action tag to submit the FORM to a managed bean method using HTTP POST

JSF CommandButton Example

Here below is the JSF page contains FORM tag and CommandButton. I used the binding parameter in input fields which binds to managed bean class 

Below is the Managed Bean class 

package com.catgovind;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.component.html.HtmlInputSecret;
import javax.faces.component.html.HtmlInputText;

@ManagedBean
@RequestScoped
public class Index {
	private HtmlInputText  username;
	private HtmlInputSecret password;

	//Action Method
	public String login(){
		//do Insert
		System.out.println("Username "+this.getUsername().getValue());
		System.out.println("Password "+this.getPassword().getValue());
		return "home";
		
	}

	//Bindings
	public HtmlInputText getUsername() {
		return username;
	}

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

	public HtmlInputSecret getPassword() {
		return password;
	}

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

	

	
	
}

Below is the Home.xhtml page 

This is a Home page

Below is the Navigation Rule present in faces-config.xml 

/index.xhtmlhome/Home.xhtml

The JSF page renders like below: 

Download Source Code: