I am working on implementing Ajax functionality for a table to enable partial updates every hour. Below is a snippet of my JSP code:
< head >
< meta http - equiv = "Content-Type" content = "text/html; charset=ISO-8859-1" >
< title > Insert title here < /title>
</head >
< body >
< jsp: useBean id = "bs" class = "beam_Status.BeamStatus_Bean" > < /jsp:useBean>
< br >
< h1 > Total Beamlines open are $ { bs.total_Beamopen()} < /h1>
<CENTER><H1>BEAMLINE STATUS</H1 > < /CENTER>
<center>
<table border = "1" cellpadding="1" width="750px" id="ajax">
<tr>
<th><h1><b>BEAMLINES</b > < /h1></th >
< th > < h1 > < b > STATUS < /b></h1 > < /th>
<th><h1>SYMBOLIC REPRESENTATION</h1 > < /th>
</tr >
<c:forEach var = "country" items = "${bs.beam_CurrentStatus()}">
<h3><b>
<c:choose>
<c:when test = "${country.value == 'IN OPERATION'}">
<tr>
<td class = "green" style = "text-transform: uppercase;" width = "400px"><center><h1>$ { country.key }</h1></center></td>
<td class="green" style="text-transform: uppercase;" width="300px"><center><h1>${country.value}</h1></center></td>
<td width="200px"><center><img src="red.png" align="middle" width="100" height="110" /></center></td>
</tr>
</c:when>
<c:otherwise>
<tr>
<td class="red" style="text-transform: uppercase;" width="400px"><center><h1>$ { country.key }</h1></center></td>
<td class="red" style="text-transform: uppercase;" width="300px"><center><h1>${country.value}</h1></center></td>
<td width="200px"><center><img src="green.png" align="middle" width="100" height="110" /></center></td>
</tr>
</c:otherwise>
</c:choose>
</b></h3>
</c:forEach>
</table>
</center>
Currently, the entire page refreshes due to the usage of:
<% response.setIntHeader("Refresh", 5); %>
I am new to Ajax and would appreciate any guidance on how to implement it in this context.