有人可以帮我解决以下问题吗?我在我的项目中使用 spring,并且我有一个 jsp 页面,其中有一个表,其中第一行是从控制器加载的。该表还有一个“添加行”按钮,用户可以使用该按钮添加多行以在提交表单之前添加更多记录。发生的情况是我使用 AutopopulatingList ,因此在提交中每一行都作为控制器中的单独对象处理。我的问题是添加按钮。我使用 JQuery 来动态添加行。但是克隆选项不合适(如果我错了,我想纠正我)因为我无法处理列表的索引。我使用了以下但没有任何效果。
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="styles.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Addcolsinviews Add</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<script type="text/javascript" src="../js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="../js/jquery.validate.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#addStudentButton").click(function() {
$('#dataTable tbody>tr:last').clone(true).insertAfter('#dataTable tbody>tr:last');
return false;
});
});
</script>
</head>
<body>
<%@include file="header.jsp" %>
</div>
<div class="main">
<%@include file="tableslist.jsp" %>
<div class="content">
<div class="subtitle">ADDCOLSINVIEWS ADD</div>
<form:form method="POST" name="addcolsForm" id="addcolsForm" commandName="addcolsinviewsadd">
<table id="dataTable">
<thead>
<tr margin-top="10px">
<th>Target View</th>
<th>Target Column</th>
<th>Source View</th>
<th>Source Column</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr id="rowToClone">
<td>
<spring:bind path="addcolsinviewsadd.addcolsinviews[0].targetview">
<form:input path="${status.expression}"/>
</spring:bind></td>
<td>
<spring:bind path="addcolsinviewsadd.addcolsinviews[0].targetcol">
<form:input path="${status.expression}"/>
</spring:bind></td>
<td>
<spring:bind path="addcolsinviewsadd.addcolsinviews[0].sourceview">
<form:input path="${status.expression}"/>
</spring:bind></td>
<td>
<spring:bind path="addcolsinviewsadd.addcolsinviews[0].sourcecol">
<form:input path="${status.expression}"/>
</spring:bind></td>
<td><input type="button" id="addStudentButton" value="Add"/></td>
</tr>
</tbody>
</table>
<input id="actionbtn" type="submit" value="Process">
</form:form>
</div>
</div>
</body>
</html>
第二次试用是 jquery 的一部分,如下所示:
<SCRIPT language="javascript">
$(document).ready(function() {
var incrementVar = 0;
$("#addStudentButton").click(function() {
incrementVar++;
var appendTxt = "<tr>";
appendTxt = appendTxt +
"<td><spring\:bind path=\"addcolsinviewsadd.addcolsinviews[" + incrementVar + "].targetview\">";
appendTxt = appendTxt +
"<form\:input path=\"${status.expression}\"/>";
appendTxt = appendTxt +
"</spring\:bind></td>";
appendTxt = appendTxt +
"<td><spring\:bind path=\"addcolsinviewsadd.addcolsinviews[" + incrementVar + "].targetcol\">";
appendTxt = appendTxt +
"<form\:input path=\"${status.expression}\"/>";
appendTxt = appendTxt +
"</spring\:bind></td>";
appendTxt = appendTxt +
"<td><spring\:bind path=\"addcolsinviewsadd.addcolsinviews[" + incrementVar + "].sourceview\">";
appendTxt = appendTxt +
"<form\:input path=\"${status.expression}\"/>";
appendTxt = appendTxt +
"</spring\:bind></td>";
appendTxt = appendTxt +
"<td><spring\:bind path=\"addcolsinviewsadd.addcolsinviews[" + incrementVar + "].sourcecol\">";
appendTxt = appendTxt +
"<form\:input path=\"${status.expression}\"/>";
appendTxt = appendTxt +
"</spring\:bind></td></tr>";
alert(appendTxt);
$("#dataTable tr:last").after(appendTxt);
</script>
上面的问题是根本没有添加行。该页面似乎尝试添加一行,但它太小了..我没有收到任何错误。在 appendTxt 的警报中 ${status.expression} 不存在。路径为空。我这就是问题所在。有谁知道语法是否可以,或者我是否可以以其他方式写这个?
我不知道该怎么做,我已经搜索了很多.. 请感谢您的帮助。