为什么ajax没有部分刷新我的页面?

时间:2016-04-25 23:33:26

标签: javascript ajax jsp controller

我正在使用带有javascript的ajax来取消或发送操作。当我点击取消链接时,此页面没有变化,我需要刷新整个页面才能看到更改后的状态。点击发货链接时没有任何反应,甚至刷新整个页面。我的jsp和控制器代码如下所示:

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.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); */
        xmlHttp.send(null);
        return false; 
        /* var row = document.getElementById(rowID);
        row.parentNode.removeChild(row); */
    }
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.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); */
        xmlHttp.send(null);
        return false; 
        /* var row = document.getElementById(rowID);
        row.parentNode.removeChild(row); */
    }

</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>

控制器:

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");
}

任何人都可以帮我解决这个问题吗?谢谢!

1 个答案:

答案 0 :(得分:0)

嗯,检查一直使用的响应:

    if (xmlhttp.readyState==4 && xmlhttp.status==200)

也许您没有在回复中获得正确的状态?