Utilizing ajax in conjunction with javascript for canceling or shipping actions. Upon clicking the cancel link, no immediate change is reflected on the page, requiring a complete refresh to see the updated status. Clicking the ship link yields no result even after refreshing the entire page. The JSP and controller code are displayed below:
JSP:
<script>
var xmlHttp;
xmlHttp = GetXmlHttpObject();
function GetXmlHttpObject()
{
var xmlHttp = null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
} catch (e)
{
// Internet Explorer
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function cancelOrder(orderId, rowID){
if (xmlHttp == null)
{
alert("Your browser does not support AJAX!");
return;
}
var query = "action=cancel&order=" + orderId;
/* alert(orderId); */
xmlHttp.onreadystatechange = function stateChanged()
{
if (xmlHttp.readyState == 4)
{
var status = document.getElementById(rowID);
alert(status.innerHTML);
status.innerHTML = "Canceled";
}
};
xmlHttp.open("GET", "manageUserAccount.htm?"+query, true);
xmlHttp.send(null);
return false;
}
function shipOrder(orderId, rowID){
if (xmlHttp == null)
{
alert("Your browser does not support AJAX!");
return;
}
var query = "action=ship&order=" + orderId;
/* alert(orderId); */
xmlHttp.onreadystatechange = function stateChanged()
{
if (xmlHttp.readyState == 4 && xmlhttp.status==200)
{
var status = document.getElementById(rowID);
alert(status.innerHTML);
status.innerHTML = "Canceled";
}
};
xmlHttp.open("GET", "manageUserAccount.htm?"+query, true);
xmlHttp.send(null);
return false;
}
</script>
<c:forEach var="order" items="${user.orders}" varStatus="vs">
<tr>
<td>${order.id}</td>
<td>${order.createDate}</td>
<td>${order.status}</td>
<td><a href="manageUserAccount.htm?action=viewDetails&orderId=${order.id}">View Details</a></td>
<td><a onclick = "shipOrder(${order.id}, ${vs.index})">Ship the order</a><br><a onclick = "cancelOrder(${order.id}, ${vs.index})">Cancel the order</a></td>
</tr>
</c:forEach>
Controller:
if(action.equals("cancel")){
OrderDAO orderDao = new OrderDAO();
System.out.println(request.getParameter("order"));
Long orderId = Long.parseLong(request.getParameter("order"));
Order order = orderDao.get(orderId);
order.setStatus("Canceled");
orderDao.save(order);
JSONObject obj = new JSONObject();
obj.put("cancel", "Canceled");
}
if(action.equals("ship")){
OrderDAO orderDao = new OrderDAO();
System.out.println(request.getParameter("ship"));
Long orderId = Long.parseLong(request.getParameter("ship"));
Order order = orderDao.get(orderId);
order.setStatus("Shipped");
orderDao.save(order);
JSONObject obj = new JSONObject();
obj.put("ship", "Shipped");
}
Seeking assistance in resolving this issue. Appreciate any help provided. Thank you!