jquery-引导模式在ajax错误响应时消失
我使用引导模式上的表单通过 AJAX 将数据从模式发送到 ASP.NET MVC 平台中的控制器。此控制器将数据保存在数据库中并发送回json数据以报告此活动的成功或失败。
以下代码在 ajax 上按预期工作,success response但在 上error response,引导模式只是消失,而没有按预期在模式上显示错误消息。
.ajax
<script>
$("#actionButton").click(function () {
$.ajax({
url: '@Url.Action("Action","Home")',
type: "post",
data: $("#actionForm").serialize()
})
.done(function (response) {
if (response.Success) {
//data is saved.
$(".alert-success").show();
$("#actionForm").hide();
}
else {
$(".errorDiv").html(response.Message);
}
});
});
</script>
在 AJAX 成功响应中,模态的行为与预期一样,即$(".alert-success")显示(最初隐藏),并且$("#actionForm")正在隐藏。
HTML
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Get Your Survey</h5>
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="alert alert-success collapse">
<span>
Success
</span>
</div>
<form id="actionForm">
<div class="form-group">
@Html.TextBoxFor(m => m.firstName, new { placeholder = "First Name", @class = "form-control form-control-sm" })
</div>
<div class="form-group">
@Html.TextBoxFor(m => m.lastName, new { placeholder = "Last Name", @class = "form-control form-control-sm" })
</div>
<button id="actionButton" class="data-btn btn btn-outline-success" type="submit">
<i class='fa fa-paper-plane'></i>
Send
</button>
</form>
<div class="errorDiv">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
MVC 控制器内的代码:
[HttpPost]
public JsonResult Action([Bind(Include = "Id,firstName,lastName")] InqueryViewModel model)
{
JsonResult json = new JsonResult();
if (ModelState.IsValid)
{
Inquery inquery = new Inquery();
inquery.firstName = model.firstName;
inquery.lastName = model.lastName;
var result = SaveInqueries(inquery);
json.Data = new { Success = true };
}
else
{
json.Data = new { Success = false, Message = "Unable to perform an action on sending" };
}
return json;
}
那么,是什么导致该代码在 ajax 响应成功时表现出预期的行为,而当 ajax 响应为负时则无法正常工作。