У меня есть форма MVC 5, которая отправляется через jquery и отправляет форму методу HTTPPost на контроллере. Все работает отлично, но мне нужно, чтобы проверить форму. Сейчас он покажет сводку проверки на странице с элементами управления, но наложение экрана будет включено, но не отобразит всплывающее окно. Поэтому я думаю, что он работает на полпути. Я просто не хочу, чтобы он перекрывал экран, и я не хочу, чтобы всплывающее окно отображалось, если форма недействительна. Как я могу это достичь?Отключить Модальное всплывающее окно, если форма не действительна
Форма cshtml
@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { id = "ballotForm" }))
{
@Html.AntiForgeryToken()
@Html.EditorFor(m => m.BallotViewModel, new ViewDataDictionary(ViewData) { TemplateInfo = new TemplateInfo { HtmlFieldPrefix = "BallotViewModel" } })
<table class="col-sm-12">
<tr>
<td>
<button type="submit" class="btn btn-default btn-md btn-submit" data-target="#modal-container" data-toggle="modal">
<span class="glyphicon glyphicon-send" aria-hidden="true"></span> Submit
</button>
</td>
</tr>
</table>
}
JQuery
$(function() {
$('#ballotForm').on('submit', function (e) {
var isValid = $('#ballotForm').valid();
console.log(isValid);
if (isValid)
{
e.preventDefault();
var data = $(this).serialize();
var url = $(this).attr('target');
$.post(url, data)
.done(function (response, status, jqxhr) {
$('#modal-container').on('show.bs.modal', function (event) {
var modal = $(this);
console.log(modal);
modal.find('.modal-content').html(response);
console.log(response);
});
$('#modal-container').modal('show');
})
.fail(function (jqxhr, status, error) { });
}
});
});
Я использовал следующую библиотеку, чтобы выполнить проверку с помощью бутстрапа. https://github.com/johnnyreilly/jQuery.Validation.Unobtrusive.Native – Marko
, что не сработало для меня – JMO