Using JSP for Dynamic Web Content Generation
While Servlets can dynamically generate HTML responses, they require extensive string concatenation. Writting Java code that builds HTML strings is cumbersome and error-prone, as it involves handling HTML syntax, CSS styles, external JavaScript files, and various rseource paths.
JSP (JavaServer Pages) simplifies this process by allowing developers to embed Java code directly within HTML. This approach makes it easier to generate dynamic content. Below is an example that creates an HTML table based on user-provided parameters for rows and columns.
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Dynamic Table Generator</title>
<style>
.data-table { border: 2px solid #2c3e50; width: 60%; margin: 20px auto; }
.data-cell { border: 1px solid #7f8c8d; padding: 8px; text-align: center; }
</style>
</head>
<body>
<%
String rowsParam = request.getParameter("rows");
String colsParam = request.getParameter("cols");
int numRows = Integer.parseInt(rowsParam);
int numCols = Integer.parseInt(colsParam);
StringBuilder tableBuilder = new StringBuilder();
tableBuilder.append("<table class='data-table'>");
for (int r = 1; r <= numRows; r++) {
tableBuilder.append("<tr>");
for (int c = 1; c <= numCols; c++) {
tableBuilder.append("<td class='data-cell'>");
tableBuilder.append("R" + r + "C" + c);
tableBuilder.append("</td>");
}
tableBuilder.append("</tr>");
}
tableBuilder.append("</table>");
out.print(tableBuilder.toString());
%>
</body>
</html>
Embedding Java Logic in JSP
JSP allows Java code to be inserted using <% %> scriptlets. To output a variable's value direct into the HTML, use the <%= %> expression syntax. The following example generates a random score and displays its corresponding grade.
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Score Grade Evaluator</title>
</head>
<body>
<%
int randomScore = (int)(Math.random() * 101);
%>
<p>Generated Score: <%= randomScore %></p>
<p>Grade:
<%
int scoreCategory = randomScore / 10;
switch(scoreCategory) {
case 10:
case 9:
%>
A
<%
break;
case 8:
%>
B
<%
break;
case 7:
%>
C
<%
break;
case 6:
%>
D
<%
break;
default:
%>
E
<%
}
%>
</p>
</body>
</html>