Introduction
Hello and welcome, readers! We hope you are doing well.
Today, we will discuss how to edit a data table in JSF. After completing this article, you will clearly understand the JSF Data Table. So follow the article till the end. So, without further ado, let’s jump into the implementation and see how to edit a data table.
Implementation
To put the example application into action, follow these steps.
- Create a demo project in any IDE that supports Java Web applications, such as NetBeans. For the subsequent implementation program, we will employ the Apache Netbeans IDE.
- Select the web application project type from the Java with Maven category.
- Pick any practical name for your project and packages.
- Choose Java EE 7 for the web and the GlassFish Server.
- Select Properties after right-clicking the project name in the Project window's folder section.
- Under the Frameworks tab, add the Java Server Faces framework.
- Modify the "index.xhtml," "StudentBean.java", and other files per the code below.
- Compile and run the application to see if it is being compiled in the previously configured environment.
- Create the web application and deploy it as a war file via the GlassFish server. After execution, the program's output should be displayed in the default browser window.
Folder Structure
As previously stated, the folder structure should resemble the image below.
(Folder structure of JSF web application)
Code
StudentBean.java:
package com.mycompany.demoproject;
import java.io.Serializable;
import java.math.BigDecimal;
import java.util.ArrayList;
import java.util.Arrays;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean(name="student")
@SessionScoped
public class StudentBean implements Serializable{
private static final long serialVersionUID = 1L;
String studentId;
String studentName;
BigDecimal height;
int rank;
public String getStudentId() {
return studentId;
}
public void setStudentId(String studentId) {
this.studentId = studentId;
}
public String getStudentName() {
return studentName;
}
public void setStudentName(String studentName) {
this.studentName = studentName;
}
public BigDecimal getHeight() {
return height;
}
public void setHeight(BigDecimal height) {
this.height = height;
}
public int getRank() {
return rank;
}
public void setRank(int rank) {
this.rank = rank;
}
//declaring data items in data table
private static final ArrayList<Student> studentList =
new ArrayList<>(Arrays.asList(
new Student("200465", "Arpita Priyadarsini",
new BigDecimal("156.60"), 1),
new Student("200466", "Bijay Kumar",
new BigDecimal("175.00"), 2),
new Student("200467", "Fiza Afreen",
new BigDecimal("168.00"), 8),
new Student("200468", "Anoushka Karkoon",
new BigDecimal("163.70"), 3),
new Student("200469", "Arpita Kumari",
new BigDecimal("170.00"), 10)
));
public ArrayList<Student> getStudentList() {
return studentList;
}
public String saveAction() {
for (Student student : studentList){
student.setEditable(false);
}
return null;
}
public String editAction(Student student) {
student.setEditable(true);
return null;
}
public static class Student{
String studentId;
String studentName;
BigDecimal height;
int rank;
boolean editable;
public Student(String studentId, String studentName,
BigDecimal height, int rank) {
this.studentId = studentId;
this.studentName = studentName;
this.height = height;
this.rank = rank;
}
public boolean isEditable() {
return editable;
}
public void setEditable(boolean editable) {
this.editable = editable;
}
public String getStudentId() {
return studentId;
}
public void setStudentId(String studentId) {
this.studentId = studentId;
}
public String getStudentName() {
return studentName;
}
public void setStudentName(String studentName) {
this.studentName = studentName;
}
public BigDecimal getHeight() {
return height;
}
public void setHeight(BigDecimal height) {
this.height = height;
}
public int getRank() {
return rank;
}
public void setRank(int rank) {
this.rank = rank;
}
}
}index.xhtml:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title>Add Data to Data Table</title>
</h:head>
<h:body>
<h1>Demonstration of Add Data to Data Table in JSF</h1>
<h:form>
<h:dataTable value="#{student.studentList}" var="s">
<h:column>
<f:facet name="header">Student ID</f:facet>
<h:inputText value="#{s.studentId}" size="10" rendered="#{s.editable}" />
<h:outputText value="#{s.studentId}" rendered="#{not s.editable}" />
</h:column>
<h:column>
<f:facet name="header">Student Name</f:facet>
<h:inputText value="#{s.studentName}" size="20" rendered="#{s.editable}" />
<h:outputText value="#{s.studentName}" rendered="#{not s.editable}" />
</h:column>
<h:column>
<f:facet name="header">Height</f:facet>
<h:inputText value="#{s.height}" size="10" rendered="#{s.editable}" />
<h:outputText value="#{s.height}" rendered="#{not s.editable}" />
</h:column>
<h:column>
<f:facet name="header">Student Rank</f:facet>
<h:inputText value="#{s.rank}" size="5" rendered="#{s.editable}" />
<h:outputText value="#{s.rank}" rendered="#{not s.editable}" />
</h:column>
<h:column>
<f:facet name="header">Action</f:facet>
<h:commandLink value="Edit" action="#{student.editAction(s)}"
rendered="#{not s.editable}" />
</h:column>
</h:dataTable>
<h:commandButton value="Save" action="#{student.saveAction}" />
</h:form>
</h:body>
</html>Output 1(Before Clicking the Edit Button)
Output 2(After Clicking the Edit Button)
34+ registered 
