In this exercise, you’ll modify the Future Value Calculator application to inclu
ID: 3885648 • Letter: I
Question
In this exercise, you’ll modify the Future Value Calculator application to include a header and footer.
Review the project
Open the header.jsp file and note that it contains the code necessary for the start of an HTML page including the opening html, head, and body tags, the title for the web page, and a link including the CSS file.
Open the footer.jsp file and note that includes a copyright notice and the closing body and html tags.
Modify the code
Open the index.jsp file and remove the code from the file that now exists in the header and footer files.
At the top of the file, include header.jsp file. You can use any one of the three techniques you learned in chapter 6 for doing so.
At the bottom of the file, include the footer.jsp file. Again, you can use any one of the three techniques you learned in chapter 6.
Repeat steps 4-6 for the result.jsp file.
Run the application. Note that header.jsp file displays the title and CSS file for both pages. Also, note that the footer.jsp file displays the copyright notice at the bottom of both pages.
Use your browser to view the source code for the web page and examine the HTML. Note that the server merged the HTML in the header.jsp and footer.jsp files into the code for the final page, and the browser sees it all as one page.
index.jsp
<%@page contentType="text/html" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Murach's Java Servlets and JSP</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<section>
<h1>Future Value Calculator</h1>
<p><i>${message}</i></p>
<form action="calculate" method="post">
<label>Investment Amount:</label>
<input type="text" name="investment"
value="${calculation.monthlyInvestmentAmount}"/><br>
<label>Yearly Interest Rate:</label>
<input type="text" name="interest_rate"
value="${calculation.yearlyInterestRate}"/><br>
<label>Number of Years:</label>
<input type="text" name="years"
value="${calculation.years}"/><br>
<label> </label>
<input type="submit" value="Calculate"/><br>
</form>
</section>
Header.jsp
<%@page contentType="text/html" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Murach's Java Servlets and JSP</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
footer.jsp
<section>
© 2014, Mike Murach and Associates
</section>
</body>
</html>
result.jsp
<%@page contentType="text/html" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Murach's Java Servlets and JSP</title>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<section>
<h1>Future Value Calculator</h1>
<label>Investment Amount:</label>
<span>${calculation.monthlyInvestmentAmountCurrencyFormat}</span><br />
<label>Yearly Interest Rate:</label>
<span>${calculation.yearlyInterestRate}</span><br />
<label>Number of Years:</label>
<span>${calculation.years}</span><br />
<label>Future Value:</label>
<span>${calculation.futureValueCurrencyFormat}</span><br />
</section>
</body>
</html>
Explanation / Answer
index.jsp:
<%@include file="header.jsp"%>
<section>
<h1>Future Value Calculator</h1>
<p><i>${message}</i></p>
<form action="calculate" method="post">
<label>Investment Amount:</label>
<input type="text" name="investment"
value="${calculation.monthlyInvestmentAmount}"/><br>
<label>Yearly Interest Rate:</label>
<input type="text" name="interest_rate"
value="${calculation.yearlyInterestRate}"/><br>
<label>Number of Years:</label>
<input type="text" name="years"
value="${calculation.years}"/><br>
<label> </label>
<input type="submit" value="Calculate"/><br>
</form>
</section>
<%@include file="footer.jsp"%>
result.jsp:
<%@include file="header.jsp"%>
<section>
<h1>Future Value Calculator</h1>
<label>Investment Amount:</label>
<span>${calculation.monthlyInvestmentAmountCurrencyFormat}</span><br />
<label>Yearly Interest Rate:</label>
<span>${calculation.yearlyInterestRate}</span><br />
<label>Number of Years:</label>
<span>${calculation.years}</span><br />
<label>Future Value:</label>
<span>${calculation.futureValueCurrencyFormat}</span><br />
</section>
<%@include file="footer.jsp"%>
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.