我有一个jsp，我可以在浏览器的表格中看到保存在数据库中的结果，其中包含编辑、删除每一行的选项。我希望能够单击编辑链接，使用 Spring MVC 和 Hibernate 从数据库中获取该特定客户的数据，并将其显示在编辑模式上，以便用户可以查看数据并知道要编辑哪些数据。
下面是代码片段，
我看到了这个解决方案(Spring MVC Populate Modal Form)，但它没有显示如何调用模式来填充ajax中的值。或者还有其他办法吗？谁能帮忙，谢谢。
<c:forEach var="customer" items="${customers}" varStatus="status">
<tr>
<td><c:out value="${status.count}" /></td>
<td><a title="Go to the Company Certificate Detail">${customer.customerName}</a></td>
<td>${customer.contactName}</td>
<td>${customer.street}</td>
<td>${customer.state}</td>
<td>${customer.zipCode}</td>
<td>${customer.country}</td>
<td>${customer.email}</td>
<!--below line of code till end of tag </td> not showing on browser -->
<td>
<div class="btn-group">
<button type="button"
class="btn btn-default dropdown-toggle"
data-toggle="dropdown">
Actions <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a data-toggle="modal"
data-target="#editCustomerModal">Edit Customer Detail</a></li>
<li><a data-toggle="modal" data-target="#deleteCustomerModal_${customer.id}" >Delete Customer</a></li>
</ul>
</div>
</td>
</tr>
<!--Delete Customer Modal -->
<div id="deleteCustomerModal_${customer.id}" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Confirm Delete</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to delete this Customer? </p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<a href="${pageContext.request.contextPath}/delete?id=${customer.id}" title="Delete"><i class="fa fa-trash-o"></i>Delete</a>
</div>
</div>
</div>
</div>
</c:forEach>
我要编辑的模态:
<!--Edit Customer Modal -->
<div id="editCustomerModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
Create New Customer
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<table class="form-table">
<tbody>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="pool-name">Customer Name:</label></td>
<td><input type="text" id="customerName" title="Company Name" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Contact Name:</label></td>
<td><input type="text" id="contactName" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="description">Street:</label></td>
<td><input type="text" id="street" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="description">State:</label></td>
<td><input type="text" id="state" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Zip-Code:</label></td>
<td><input type="text" id="zipCode" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Country:</label></td>
<td><input type="text" id="country" path="#"
class="form-control" /></td>
</tr>
<tr valign="top">
<td style="width: 25% !important;"><label
class="not-required" for="expire-after">Email:</label></td>
<td><input type="text" id="email" path="#"
class="form-control" /></td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<div>
<input type="submit" id="createNewCustomer" value="Save"
class="btn btn-default" onClick="alert('To be Implemented');" />
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
最佳答案
尝试一下，在编辑模型中为客户 ID 添加一个隐藏值，
<input type="hidden" id="customerId" path="customerId" class="form-control" />
将您的提交按钮更改为普通按钮以保存客户。
<div class="modal-footer">
<div>
<button type="button" class="btn btn-default updateCustomer" data-dismiss="modal">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
你可以玩js，特别是ajax，
<script type="text/javascript">
function ajaxCall(customerId) {
$.ajax({
type: "POST",
url: "/clause/getUpdate?customerId="+customerId ,
success: function(result) {
//populate customer list page again..
}
}
});
$('.updateCustomer').on('click', '.accountsEmployees', function () {
customerId=$("#customerId").val();
ajaxCall(customerId);
}
</script>
关于javascript - 如何使用 ajax 和 spring MVC 填充模态表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46207712/