在 JSP 中使用 Ajax 响应
Posted
技术标签:
【中文标题】在 JSP 中使用 Ajax 响应【英文标题】：Use an Ajax response in JSP 【发布时间】：2011-11-27 20:58:49 【问题描述】：我有一个JSP 页面，它只有一个普通的五行五列 html 表格。
现在我正在进行 Ajax 调用并得到响应。现在，一旦我收到回复，我需要将数据填充到表格的适当单元格中。
所以我的问题是；
-
我应该使用JSON 来构建响应吗？
如何在 JSP 级别处理数据。也就是说，一旦我得到服务器的响应？
作为附加信息，我正在使用DWR，它只是从 javascript 代码内部调用 Java 方法（构建响应）。
【问题讨论】：
看到当我说客户端时，我实质上是指 JS 代码和从 JSP 生成的 html 代码...我不太理解反对票... 那个反对票不是我的。也许有人因为您对英语的关注度低而感到烦恼，或者确信您的研究工作不佳（我想这些信息可以在 DWR 指南/教程中找到）。 英文错误是因为我是从我的 iPad 上写出来的，因此打字不是很流畅......我也检查了 dwr 文档......它没有这个信息...... iPad 与否，例如，您可以只写“because”和“I”而不是“bcoz”和“i”。 是的，我可以..但肯定不是很容易在上面输入长词或句子而不会出错:) 【参考方案1】：让我们考虑这个 Java 类。
class Employee
int id;
String eName;
// Setters and getters
在 JavaScript 中，JSON 对象：
var employee =
id : null,
name : null
;
这是从 JavaScript 函数调用 Java 方法：
EmployeeUtil.getRow(employee,dwrData);
在EmployeeUtil类的getRow()中，方法的返回类型为Employee：
Employee getRow();
所以使用 Employee 的 setter 设置数据。 dwrData 是回调函数。
function dwrData(data)
employee=data;
返回的数据是一个Employee bean，将在回调函数中。
只需在 JavaScript JSON 对象中初始化它。
相应地使用 JSON 对象来填充表格。
编辑：
您可以使用List getRow() 代替Employee getRow()，以List 而不是Bean 的形式返回行列表。
现在响应包含列表作为数据。
请参考Populate rows using DWR。
检查这些示例以填充表中的数据：
DWR + Dojo Demo Dynamically Editing a Table我应该使用 JSON 来构建响应吗？
无需传递 JSON 作为响应。而是返回上面提到的类的 Bean。
列表可以作为响应传递，也如上所述。
如何在 JSP 级别处理数据。也就是说，一旦我得到服务器的响应。
查看上面的解释和给定链接的示例，以在 JSP 中处理响应并在表格中显示响应数据。
DWR basics on YouTube【讨论】：
非常感谢您的回复..你似乎真的很接近我正在寻找的东西..尽管如此，我需要多次阅读您的示例才能理解，首先阅读，我只是想知道我是否可以轻松地将其扩展到多个表行列数据..如果我应该考虑 dojo，我也有点困惑，因为我没有使用太多......我的。简单的要求是进行 DWR 调用并将响应数据粘贴到所有 5x5 表或基于 div 的网格中.. 也只是补充一下，2格需要填写；在页面加载或用户点击任何链接后... 不需要使用 DOJO 看看这个directwebremoting.org/dwr/documentation/browser/util/… 再次感谢..当你说相应地使用 JSON 对象填充到表中时......你能否让我知道如何做到这一点......从服务器端，我知道我需要在客户端使用Java bean和json..请确认.... 如果我有基于 div 的网格，也可以使用类似的逻辑，即我需要填充无表布局【参考方案2】：Ajax 部分：我们返回一个对象列表：
public List<IdTexto> getPaisesStartingBy(String texto,String locale)
List<IdTexto> res = new ArrayList<IdTexto>();
// Fill the array
return res;
IdTexto 是一个带有 getter 和 setter 的简单 bean：
public class IdTexto
private int id;
private String texto;
private String texto2;
// getters and setters
并且在dwr.xml中定义为bean：
<convert converter="bean" match="com.me.company.beans.IdTexto"/>
并且包含java函数的类被定义为creator：
<create creator="new" javascript="shopdb">
<param name="class" value="com.me.company.ajax.ShopAjax"/>
</create>
在jsp中，我们定义了一个函数javascript来检索由某个文本对象开始的List：
shopdb.getPaisesStartingBy(req.term,'<s:text name="locale.language"/>', writePaises);
以及写下文字的对应函数：
function writePaides (data)
var result="<table>";
for (i=0; i<data.length;i++)
id = data[i].id;
texto=data[i].texto;
texto2=data[i].txto2;
// now we write inside some object in the dom
result+="<tr><td>"+id+"</td><td>"+texto+"</td><td>"+texto2+"</td></tr>";
result+="</table>";
$("tabla").innerHTML=result;
如果您不是 bean，而是拥有其他对象，您将以相同的方式访问属性。
【讨论】：
非常感谢...2件事；一是我不想输出完整的 html 字符串。它应该类似于已经存在占位符，我将通过解析响应来填充它们，二是我计划为我的表使用基于 div 的网格即将创建相同的网格但不使用表标签..thx 我们也可以将此逻辑扩展到像二维数组这样的多维数组吗？ 使用占位符没问题，只需使用javascript函数修改其内容即可。我没有测试过使用列表属性，但是您可以使用 dwr 将任何 java 对象转换为 js，所以，我认为可以发送列表列表。【参考方案3】：-
如果您使用 DWR，则不需要使用 JSON，它会在内部使用。
使用javascript，jsp代码超出范围。该页面已生成，因此您只能使用 javascrip 修改 DOM
在 DWR 教程中有很多示例可以满足您的需求。我想你只需要做一些事情：
dwrobject.funtionAjax(param,returnFunction);
...
function returnFunction(data)
// use javascript to change the dom
【讨论】：
你是说代码吗？有很多方法可以完成您的需求。基础是 ajax 函数应该返回一个 List 并且它们从 js 你可以访问列表的每个元素作为 data[index]。如果列表中的元素是另一个列表，您可以使用相同的方式再次访问 data[index1][index2]。请记住，列表中的最终对象在 dwr.xml 中定义为 bean。 你能提供任何你刚才提到的两件事的例子吗？以 List 形式返回并在 Javascript 中进行相应的解析。只有您能提供详细的示例，我才能接受。。【参考方案4】：我经常做的是为这种情况设置两个 servlet：
MyServlet
MyAJAXServlet
MyServlet 处理正常的 HTTP 请求，并且（通常）最终使用 RequestDispatcher 将请求转发到 JSP。
例子：
public class MyServlet extends HttpServlet
private static final long serialVersionUID = -5630346476575695999L;
public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException
doGetAndPost(req, res);
public void doPost(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException
doGetAndPost(req, res);
private final void doGetAndPost(HttpServletRequest req,
HttpServletResponse res) throws ServletException, IOException
/*
* Handle the response here, manipulate the 'MODEL'
*/
/*
* Forward to the 'VIEW' (No Baba Wawa jokes please)
*/
RequestDispatcher rdis = req.getRequestDispatcher("Path/To/My/JSP");
rdis.forward(req, res);
AJAX servlet 检查请求的参数列表是否存在“命令”：
public class MyAJAXServlet extends HttpServlet
private static final long serialVersionUID = -5630346476575695915L;
public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException
doGetAndPost(req, res);
public void doPost(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException
doGetAndPost(req, res);
private final void doGetAndPost(HttpServletRequest req,
HttpServletResponse res) throws ServletException, IOException
String cmd = req.getParameter("cmd");
if (cmd == null || cmd.length() < 1)
/* Custom fail mode here, perhaps toss back failure HTML */
return;
/* Easily implement command pattern here, but for simplicity, we will use an if tree */
if (cmd.equalsIgnoreCase("getSomeData"))
String out = "<tr><td>ExampleCell in ExampleRow</td></tr>";
res.getWriter().append(out);
return;
else if (cmd.equalsIgnoreCase("someOtherCommand"))
/* Do something else */
如果您格式化您的 JSP 以允许像这样批量替换 html 元素：
<table id="pleaseReplaceMyContentsTABLE">
<tr><td> </td></tr>
</table>
那么动态修改一个网页内容就变得很容易了（这个例子我用的是JQuery）：
var url = "http://mydomain.whatever/myapp/MyAJAXServletMappedURL?cmd=getSomeData";
$.post(url, function(data)
//Message data a bit & display
$("#pleaseReplaceMyContentsTABLE").html(data);
);
从 AJAX Servlet 发回预格式化 HTML 的一些限制：
-
如果您要发回中等到大量的数据，那么当客户端数量开始增加时，您的网络服务器很容易过载。好吧，它不会很好地扩展。
用于格式化 HTML 以发送给客户端的 Java 代码会变得丑陋且难以阅读。快点。
【讨论】：
【参考方案5】：JSP 页面是动态生成的 servlet。一旦用户点击 JSP 页面，他们就会收到动态生成的 HTML，除非他们完成诸如点击“刷新”或提交表单之类的操作，否则不再与生成它的 JSP 页面对话。查看 Oracle 的JSP Page 了解更多信息，查看Wikipedia 以获得对 JSP 技术的高级解释。
要处理 AJAX，您需要定义一个能够处理来自 Javascript 的 XML 请求的新网络端点。请参阅this example、this library 或此JSON Example。
【讨论】：
为此非常感谢..我在示例中找不到我正在寻找的东西......虽然我非常了解使用 JSP，但我正在寻找的是如何解析动态 AJAX 响应并使用它来填充表格单元格......即假设响应返回 5x5（或者更确切地说是 25 个数据点）...我需要解析它们并使用它们来填充我的 5x5 表格单元格..以上是关于在 JSP 中使用 Ajax 响应的主要内容，如果未能解决你的问题，请参考以下文章