在AJAX中处理servlet输出

Question

我的问题：我正在从JSP中的AJAX函数向servlet发送请求。

该servlet处理数据并返回ArrayList。

我的问题是如何处理AJAX内部的ArrayList，并将其显示为同一个JSP中的表。

的代码是

function ajaxFunction () { 

// var url= codeid.options[codeid.selectedIndex].text; 
url="mstParts?caseNo=9&cdid=QCYST0020E1"; 
// alert(cid); 
    var httpRequest; 
    if (window.XMLHttpRequest) { 
     httpRequest = new XMLHttpRequest(); 
    } else if (window.ActiveXObject) { 
     httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    if (httpRequest == null){ alert('null');} 

alert(url); 
    httpRequest.open("GET", url, true); 

    httpRequest.onreadystatechange = function() { alertContents(httpRequest); }; 
    //httpRequest.setRequestHeader('Content-Type', 'text/plain'); 
    httpRequest.send(null); 

    alert('t1'); 
} 

function alertContents(httpRequest) { 
    if (httpRequest.readyState == 4) { 
     var cType =httpRequest.getResponseHeader("Content-Type"); 
     //document.write(httpRequest.toString()); 
     // alert(cType); 
     // var xmlDoc=httpRequest.responseText; 
     //document.write(xmlDoc.toString()); 
     // if (xmlDoc == null) {alert('null returned');} 
     if (!httpRequest.status == 200) { 
      alert('Request error. Http code: ' + httpRequest.status); 
     } 
     else 
      { 
       var profileXML = eval(<%=request.getAttribute("data")%>); 
       if (profileXML != null){ alert('null'); }//else { alert(profileXML(0)); } 
       // httpRequest.getAttribute("data"); 


      } 
    } 
} 

Answer 1

var profileXML = eval(<%=request.getAttribute("data")%>); 

首先，我建议您了解JavaScript和JSP之间的墙。 JS完全运行在客户端和JSP/Java完全运行在服务器端。正如你所想的那样，它们当然不会同步。要了解更多信息，请阅读this blog article。

function ajaxFunction () 

其次，我会建议你使用现有的，强大的，深入开发，维护良好的JavaScript库Ajaxical能力，如jQuery，而不是重新发明AJAX轮和战斗/挣扎/担心浏览器的具体问题/麻烦/行为/痛苦。我还建议使用JSON作为服务器上的Java Servlet和客户端上的JavaScript之间的数据传输格式。在Java方面，你可以使用伟大的Gson库。

下面是所有提到的技术的启示例子。让我们先从一个Servlet和JavaBean的：

public class JsonServlet extends HttpServlet { 
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
     List<Data> list = dataDAO.list(); 
     response.setContentType("application/json"); 
     response.setCharacterEncoding("UTF-8"); 
     response.getWriter().write(new Gson().toJson(list)); 
    } 
} 

public class Data { 
    private Long id; 
    private String name; 
    private Integer value; 
    // Add/generate getters/setters. 
} 

的JsonServlet（你可以命名为任何你想要的，这只是一个简单的例子）应在web.xml被映射在已知url-pattern，让我们用/json在这个例子中。类Data只是表示您的HTML表（和数据库表）的一行。

现在，这里是你如何加载一个表的jQuery.getJSON帮助：

$.getJSON("http://example.com/json", function(list) { 
    var table = $('#tableid'); 
    $.each(list, function(index, data) { 
     $('<tr>').appendTo(table) 
      .append($('<td>').text(data.id)) 
      .append($('<td>').text(data.name)) 
      .append($('<td>').text(data.value)); 
    }); 
}); 

课程的tableid表示有问题的<table>元素的id。

应该是这样。毕竟它很简单，相信我。祝你好运。