I have a simple problem but I just can't get the darn thing to work. Here is the code I am using. When I click on the button in main.jsp, I get an updated image, from reportbuilder.do, but it's a blank image (actually, it gives a time stamp in the image to show a new image has been created). In reportbuilder.do I can see the reportType, reportScope, and reportTime are all null. What am I doing wrong?
main.jsp
<html>
<head>
<title>Failing example</title>
<script src="/scripts/jquery-1.8.1.js"></script>
<script>
$(document).ready(function() {
$("#updateReport").click(function() {
$("#chart1").load("/chart.jsp?reportType=${reportType}&reportScope=${reportScope}&reportTime=${reportTime}");
return false;
});
});
</script>
</head>
<div id="chart1">
<img src="/reportbuilder.do?">
</div>
<div id="dropDown1">
<form method="GET" action="/chart.jsp">
<select name="reportType" style="width:100%">
<option value="devBugFix">Developer Bug Fixes</option>
<option value="devHrsWork">Developer Hours Worked</option>
</select>
<select name="reportScope" style="width:100%">
<option value="cmcProg">CMC Program</option>
<option value="equFarmAs">Equestrian Farmer's Association</option>
</select>
<select name="reportTime" style="width:100%">
<option value="daily">Daily</option>
<option value="weekly">Weekly</option>
<option value="monthly">Monthly</option>
</select>
<a href="#" id="updateReport"><button>Update Chart</button></a>
</form>
</div>
</html>
chart.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<body>
<img src="/reportbuilder.do?reportType=${reportType}&reportScope=${reportScope}&reportTime=${reportTime}" alt="Image Loading Failed">
</body>
</html>
Thank you for your time!