JSP+；JavaScript：模板化_Javascript_Ajax_Templates_Jsp

JSP+；JavaScript：模板化

javascript ajax templates jsp

JSP+；JavaScript：模板化,javascript,ajax,templates,jsp,Javascript,Ajax,Templates,Jsp,我有一个使用JSP+JSTL的服务器端HTML模板，可以生成一个包含一些用户数据的表： <body> ... <table> <c:forEach items="${users}" var="user"> <tr> <td>${user.name}</td> <td>${user.age}</td>

我有一个使用JSP+JSTL的服务器端HTML模板，可以生成一个包含一些用户数据的表：

<body>
    ...
    <table>
        <c:forEach items="${users}" var="user">
        <tr>
            <td>${user.name}</td>
            <td>${user.age}</td>
            <td>${user.department}</td>
        </tr>
        </c:forEach>
    </table>
    ...
</body>


...
${user.name}
${user.age}
${user.department}
...

这是一个模板编号1

用户可以通过表单向服务器提交新数据。数据由AJAX发送，请求成功后，应将其动态附加到表中，而无需重新加载任何页面

要附加数据，我需要使用一个2号模板，它封装在JavaScript中，或者出现在HTML页面上，带有“display:none；”和“class='template'”


%用户名%
%用户年龄%
...
...
$（“.template”）.clone（）。填充模板并添加到表格（用户）//只是解释一下

问题：在这种情况下，我是否可以避免HTML代码重复，并且只使用一个模板？如果是，如何执行此操作？

您可以执行以下操作：

模板1：

<body>
    ...
    <table id="userTable">
        <c:forEach items="${users}" var="user">
        <%@include file="userRow.jsp" %>
        </c:forEach>
    </table>
    ...
</body>

JB，你的意思是，在AJAX回调中，我应该使用类似于

$（“userTable”）.append（$.load（“userRow.jsp”，“userId=“+id））

？（不正确，但只是为了表明想法）。

<body>
    ...
    <table id="userTable">
        <c:forEach items="${users}" var="user">
        <%@include file="userRow.jsp" %>
        </c:forEach>
    </table>
    ...
</body>

<tr>
    <td>${user.name}</td>
    <td>${user.age}</td>
    <td>${user.department}</td>
</tr>

function createUser(user) {
    $.get("createUser.action", user, ajaxCallbackWhichAddsANewUserToUserTable);
}

function ajaxCallbackWhichAddsANewUserToUserTable(newUserRow) {
    $("#userTable").append(newUserRow);
}