ajax - java jSTL使用ajax填充表数据

Question

我在 spring 框架中实现了一个 java ee webclient。它从网络服务中读取数据并以表格格式显示记录。在此表上，我可以通过选中复选框来删除多条记录。

目前我正在使用元刷新刷新表记录。原因是因为 javascript 计时器刷新会将页面带到顶部。它会影响他/她查看记录时的用户体验。

当用户选择要删除的记录并单击删除时，会弹出javascript 确认对话框。使用元刷新的问题是当确认对话框弹出时我无法停止刷新。我尝试了 jquery，但它没有用。

我正在考虑实现 ajax 来检索表的记录。但我怎样才能有效地实现它。表中的记录是动态的。

进一步补充，我有多个 html 表。例如，

#table 1
<table><tr><td></td>....</tr></table>

#table 2
<table><tr><td></td>....</tr></table>

#table 3
<table><tr><td></td>....</tr></table>

Answer 1

我建议您使用 JSP 作为模板。这意味着 JSP 的主体包含 HTML 代码、表单和表格等静态元素，而您可以使用标签库插入动态数据。在您的情况下，数据库记录中的数据。

<c:forEach items="${listOfRecords}" var="item">
    <table> 
        <tr>
            <td>    
                <c:out value="${item}"/>
            </td>   
        </tr>       
    </table>
</c:forEach>

然后使用 servlet，您可以将其作为响应发送给客户端。 AJAX 调用将接收响应并将 HTML 附加到当前表。在下面的代码片段中，AJAX 将请求中的数据 ("recordid="+id) 发送到位于/approot/myservlet 的 servlet。当 servlet 收到请求时，它从请求中检索记录 id，从数据库中删除记录，检索自上次查询以来添加的任何新记录，通过请求调度程序将新记录传递给 JSP，HTML 表包含新记录生成数据并将其作为响应发送回浏览器。启动 success 属性中的 javascript，并将包含在 msg 变量中的响应附加到当前表。

$.ajax({
   type: "post",
   url: "/approot/myservlet", 
   data: "recordid="+id,
   success: function(msg){ $('#table1').append(msg);
}); 

这只是我对您的解决方案的简要概述。您可能会找到我写的关于如何设置 J2EE application using a web service, JSP, Servlet, tag libs and AJAX. 的分步指南。