Показать сообщение об ошибке в том же диалоговом окне в mvc
У меня есть приложение MVC, где я реализовал всплывающее окно расширенного поиска. Если пользователь не вводит ничего в текстовое поле и нажимает кнопку поиска, я хочу оставить всплывающее окно открытым и отобразить сообщение об ошибке в том же всплывающем окне. Моя проблема в том, что он закроет это диалоговое окно и вместо этого отобразит текстовое поле для расширенного поиска и сообщения об ошибке на главной странице. Может кто-нибудь сказать мне, что я делаю не так?
Индекс
<div class="modal fade" id="AdvSearch">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<a href="#" class="close" data-dismiss="modal">×</a>
<p style="font-weight: bold" class="modal-title">Advance Search</p>
</div>
<div class="modal-body">
<form id="AdvanceSearchForm">
@Html.Partial("AdvSrchForm")
</form>
</div>
<div class="modal-footer">
<table>
<tr>
<td><p align="left">% accepts wildcard</p></td>
<td width="320px"></td>
<td><input type="submit" value="Search" class="btn btn-default" id="ASearchbtn" /></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$("#ASearchbtn").click(function () {
var form = $('#AdvanceSearchForm');
$.validator.unobtrusive.parse(form);
form.validate();
var ASData = $("#AdvanceSearchForm").serialize();
if (form.valid())
{
$.ajax({
type: "POST",
url: "/SearchPayment/SubLookup",
data: ASData,
cache: false,
success: function (response) {
$("#AdvSearch").modal("hide");
$('.modal-backdrop').remove();
$('#ASGrid').html('');
$('#ASGrid').html(response);
$('#ASGrid').show();
$("#DataList").hide();
},
error: function (error) {
console.log(error);
}
});
}
})
контроллер
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult AdvanceSearch(Payments filter)
{
Session.Clear();
//get data from db base on filter
if (!((filter.fName ?? filter.LName ?? filter.grp ?? filter.sec ?? filter.zip ?? filter.hPhone ?? filter.SSN) == null && filter.bday == null))
{
model = GetUserSession(filter);
model = (PremiumPayments)Session["PaymentData"];
return PartialView("SubscriberGrid", model);
}
else
{
ViewBag.ErrMsg = "Invalid Search - At least one field is required.";
return PartialView("AdvSrchForm");
}
}
Форма предварительного поиска (частичное представление)
@model PaymentFinder.Models.PremiumPayments
<table class="advsrchfrm">
<tr>
<td>@Html.Label("First Name %")</td>
<td>@Html.TextBoxFor(x => x.fName, new { @class = "form-control"}
</td>
<td>@Html.Label("Last Name %")</td>
<td>@Html.TextBoxFor(x => x.LName, new { @class = "form-control" })
</td>
</tr>
<tr>
<td>@Html.Label("Birthdate")</td>
<td>@Html.TextBoxFor(x => x.bday, "", new { placeholder =
DateTime.Now.ToString("d") })</td>
<td>@Html.Label("Phone #")</td>
<td>@Html.TextBoxFor(x => x.hPhone, new { @class = "form-control" })
</td>
</tr>
<tr>
<td>@Html.Label("Zip Code")</td>
<td>@Html.TextBoxFor(x => x.zip, new { @class = "form-control" })
</td>
</tr>
</table>
<br />
@if (//condition to display this)
{
<span class="text-danger" style="font-weight:
bold">@Html.Raw(ViewBag.ErrMsg)</span>
}
1 ответ
Решение
Я думаю, что проблема в том, что вы делаете сообщение, и страница полностью обновляется. Почему бы не выполнить проверку с использованием jquery, и если все верно, то отправьте сообщение.