command component tags
In JavaServer Faces (JSF), command component tags are used to trigger actions and handle navigation based on user interactions. These components facilitate handling form submissions, invoking backend logic, and navigating between different views within a JSF application. Here’s an explanation followed by a Java example for each type of command component tag used for action and navigation:

Table of Contents
Explanation
- 1. Â <h:commandButton> Tag:
- The <h:commandButton> tag is used to create a button in a JSF form that triggers a backend action when clicked.
- It is typically used to submit a form and invoke a method in a managed bean to perform business logic or data processing.
- The action attribute specifies the method to invoke in the managed bean upon button click.
- 2. Â <h:commandLink> Tag:
- The <h:commandLink> tag is used to create a hyperlink in JSF that triggers a backend action when clicked.
- It is similar to <h:commandButton> but renders as a hyperlink (<a> tag) instead of a button (<input type=”submit”>).
- The action attribute specifies the method to invoke in the managed bean upon link click.
Java Example
Here’s an example demonstrating the use of <h:commandButton> and <h:commandLink> for action and navigation in JSF:
java
package com.example.beans;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
@ManagedBean
@RequestScoped
public class CommandComponentBean {
private String message = "";
public void submitForm() {
message = "Form submitted successfully!";
// Additional business logic or data processing can be added here
}
public String navigateToHome() {
// Business logic for navigation
return "home"; // Navigation outcome
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
}
xml
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<title>JSF Command Components Example</title>
</h:head>
<h:body>
<h:form>
<h:outputLabel for="nameInput" value="Enter Name:" />
<br/>
<h:inputText id="nameInput" value="{commandComponentBean.message}" required="true" />
<h:message for="nameInput" style="color: red;" />
<br/>
<h:commandButton value="Submit" action="{commandComponentBean.submitForm}" styleClass="btn btn-primary" />
<br/><br/>
<h:outputText value="{commandComponentBean.message}" />
<br/><br/>
<h:commandLink value="Go to Home" action="{commandComponentBean.navigateToHome}" />
</h:form>
</h:body>
</html>
Explanation of Example
- Managed Bean (CommandComponentBean.java): Â This managed bean (CommandComponentBean) is request-scoped and includes:
- submitForm(): Method invoked by <h:commandButton> to handle form submission and set message.
- navigateToHome(): Method invoked by <h:commandLink> to navigate to “home” view outcome.
- JSF Page (command_components.xhtml): Â This JSF page includes an <h:form> encapsulating components:
- <h:inputText> for entering a name (nameInput), bound to message property of CommandComponentBean.
- <h:commandButton> triggering submitForm() method in CommandComponentBean on click.
- <h:commandLink> triggering navigateToHome() method in CommandComponentBean on click.
Attributes Used:
- action: Specifies the method ({commandComponentBean.submitForm} or {commandComponentBean.navigateToHome}) to invoke in managed bean upon button click or link click.
- styleClass: Assigns CSS classes to the button (btn btn-primary) for styling purposes.
These command component tags (<h:commandButton> and <h:commandLink>) in JSF enable developers to manage user interactions effectively by triggering actions and facilitating navigation between different views within a web application. They are essential for implementing interactive and responsive user interfaces in JSF-based applications.