Search by Employee ID

6.1 Employee Java Bean

Class Name:.

/main/java/com/oracle/jdbc/samples/entity/Employee.java

Use Employee.java that you created earlier in this illustration.

6.2 Create a Method in Java Bean for Search by Employee ID

Class Name:

src/main/java/com/oracle/jdbc/samples/bean/JdbcBean.java

Use the getEmployee(int empID) method to retrieve an employee record by ID.

/**
* Get List of employee based on empId. This will always return one row
* but returning a List to make signatures consistent.
* @param empId
* @return
* /
public List<Employee>getEmployee(int empId);

6.3 Implement a Method getEmployee() for Search by Employee ID

Class Name:

src/main/java/com/oracle/jdbc/samples/bean/JdbcBean.java

Use the getConnection() you created in the first step to connect to the same database.

Create a method getEmployee() to retrieve the employee based on the employee ID.

SELECT Employee_Id, First_Name, Last_Name, Email, Phone_Number, Job_Id, Salary FROM EMPLOYEES WHERE
Employee_Id = ?

Following is a sample code:

public List<Employee>getEmployee(int empId) {
List<Employee>returnValue = new ArrayList<>();
try (Connection connection = getConnection()){
try (PreparedStatement preparedStatement = connection.prepareStatement(
“SELECT Employee_Id, First_Name, Last_Name, Email, Phone_Number, Job_Id, Salary FROM EMPLOYEES WHERE Employee_Id = ?”)){
preparedStatement.setInt(1,empId);
try (ResultSet resultSet = preparedStatement.executeQuery()){
if(resultSet.next()){
returnValue.add(newEmployee(resultSet));
}
}
}
} catch (SQLException ex){
logger.log(Level.SEVERE, null, ex);
ex.printStackTrace();
}
return returnValue;
}

6.4 Create a New HTML for Search by Employee Id

Class Name:

src/main/webapp/listById.html

This HTML shows a text box to get the employee ID. Then, it generates and submits a request to search by employee ID.

Following is the code sample:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"> 
<title>List Employee by Id</title> 
<link rel="stylesheet" type="text/css" href="css/app.css" > 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
</head>
<body>
<div><label>Employee Id: </label> 
 <input id="empId" type="textfield"
onkeypress="return waitForEnter(event)"\></div>
<br/>
<br/>
<div id="id-emp"></div>
<script>
function waitForEnter(e) { 
if (e.keyCode == 13) {  
var tb = document.getElementById("empId");   
fetchElementById(tb.value) 
return false;
}
}
function fetchElementById(empId) {  
var xmlhttp = new XMLHttpRequest();
var url = "WebController?id=" +empId;
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
processResponse(xmlhttp.responseText);

}
}
xmlhttp.open("GET", url, true); 
xmlhttp.send();
}
function processResponse(response) {  var arr = JSON.parse(response);  var out = "";  if (arr == null) {    out = '<div class="alert alert-warning"><strong>Alert!</strong>'
+' No records found for the given id</div>'  }  
else {  
var i;    out = "<table>";
keys = Object.keys(arr);
out += "<tr><th>Trash</th><th>Edit</th>"
for(i = 0; i < keys.length; ++i) {
out += "<th>"+keys[i]+"</th>"
}
out += "</tr>"
out += '<tr><td><a href="javascript:confirmDelete()">'
+'<span  class="glyphicon glyphicon-trash"></span>'
+'</a></td>'
+'<td><a href="javascript:allowEditSalary()">'
+'<span class="glyphicon glyphicon-edit"></span>'
+'</a></td>'
for(i = 0; i < keys.length; ++i) {
out += "<td id='" +keys[i]+"'>"+arr[keys[i]]+"</td>"
}
out += "</tr>"
}
document.getElementById("id-emp").innerHTML = out;
}
</script>
</body>
</html>