如何用一个按钮提交两份表格

Question

我有两个表单，我想在springmvc 中用一个按钮提交它们

jsp页面：

<form:form id="form1"   method="POST"  modelAttribute="employee" >
<table>
<tr>
<th>Employee </th></tr>
<tr>
<td>Employee ID</td>
<td><form:input type="number" path="emp_id"/></td>
<td>Employee Name</td>
<td><form:input type="text"   path="name"/></td>
<td>Designation</td>
<td><form:label type="text"  path="designation"> </form:label></td>
<td>
<form:select type="text" path="designation">
<form:option value="select" label="Select"/>
<form:option value="Developer" label="Developer"/>
<form:option value="Tester" label="Tester"/>
</form:select></td>
<td>Location</td>
<td><form:label   path="location"/></td>
<td>
<form:select type="text"  path="location">
<form:option value="select" label="select"/>
<form:option value="Bangalore" label="Bangalore"/>
<form:option value="Mysore" label="Mysore"/>
</form:select></td>
<td>Employee Type</td>
<td><form:label type="text"  path="employee_type"> </form:label></td>
<td>
<form:select type="text"  path="employee_type">
<form:option value="select" label="select"/>
<form:option value="Permanent" label="Permanent"/>
<form:option value="Contract" label="Contract"/>
</form:select></td>
<td><form:hidden  path="${id}"/></tr>
</table>
<br>
</form:form>
<form:form id="form2"   method="POST"  modelAttribute="dailyreportAttribute" >
<table>
<tr>
<th>Daily Report</th>
</tr>
<tr>
<td>Date</td>
<td><form:input name="date"   path="date"  /></td>
<td>Task Type</td>
<td><form:label path="task_type"> </form:label></td>
<td>
<form:select type="text" path="task_type">
<form:option value="select" label="select"/>
<form:option value="Technical" label="Technical"/>
<form:option value="Non-Technical" label="Non-Technical"/>
</form:select></td>
<td>Description</td>
<td><form:input type="text"   path="description"/></td>
<td><form:hidden path="${emp_id}"/>
</tr>
</table>
</form:form>
<button class="button button-gray" onclick="submitform()"><span class="accept"> 
</span>Save</button>
<script>
submitform = function(){
document.getElementById("form1").submit();

setTimeOut(function() {
document.getElementById("form2").submit();
}, 5000);
}
</script>

我正试图用一个提交按钮提交两份表格。正在正确插入第一个表。。但是，第二个表正在创建中，但给出了null值。我试了很多。我不知道我在哪里犯了错。

有人能帮我吗？

Answer 1

您不能简单地逐个提交两个表单，因为它会在提交时重新加载页面。通过ajax提交一个表单，在成功回调时提交第二个表单。

在提交功能中添加这样的内容。

var data = { EmployeId: EmpId, EmployeName: EmpName.....all other data };
$.ajax({
cache: false,
data: data,
url: "Your post url",
type: "POST",
success: function (data) {
//post second form here
}
error: function(err){
//If this comes here then there is some issue in ajax request you can examine by checking data in err
}
});

您可以在jquery或javascript中获取输入字段的值。