Как я могу визуализировать частичную ошибку модального вида в другое представление с контроллера MVC? - PullRequest
0 голосов
/ 13 марта 2020

Я хотел бы, чтобы это модальное окно ошибок отображалось, если есть проблемы или ошибки, которые необходимо отобразить пользователю после вызова действия SaveDailyCriteria. Мне нужно, чтобы частичное представление было отображено в представлении, где выполняется вызов действия SaveDailyCriteria. С кодом, который у меня есть ниже, вызывается return PartialView("_ErrorsModal", notification), но он никогда не отображается на моем главном экране.

Контроллер

[HttpPost]
public ActionResult SaveDailyCriteria(Daily report, string EnteredCriteriaName)
{
    var criteria = report.ConvertToCriteria(report);
    criteria.CriteriaName = EnteredCriteriaName;
    var dr = new ReportDaily();
    var nameExists = dr.DoesCriteriaNameAlreadyExist(criteria);
    if (dr.SaveReportCriteria(criteria, nameExists, out Notification notification) == false)
    {
        return PartialView("_ErrorsModal", notification);
    }
    else {
        return View(report);
    }
}

Main Представление

@model Company.Areas.Reports.Models.Daily
@using Company.TaxCollection.Reports;
@{
    ViewData["Title"] = "Daily Report";
}

<h1>@ViewData["Title"]</h1>
<br />

@using (Html.BeginForm("DailySubmit", "Reports", FormMethod.Post, new { id = "reportForm", @class = "report-form col-9" }))
{
...
...
<div id="saveModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title float-left">Save Criteria</h4>
                <button type="button" class="close" data-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <label>Enter the name to save as:</label><input type="text" id="savedReportName" name="EnteredCriteriaName" class="form-control" />
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="saveSubmit" data-dismiss="modal">Save</button>
            </div>
        </div>

    </div>
</div>
}
<script>
$(document).ready(function () {
    var dataType = 'application/x-www-form-urlencoded; charset=utf-8';
    $(function () {
        $('#saveSubmit').on('click', function (evt) {
            var data = $('form').serialize();
            //Ajax form post
            $.ajax({
                type: 'POST',
                data: data,
                contentType: dataType,
                url: '@Url.Action("SaveDailyCriteria", "Reports")',
                success: function (data) {
                    console.log(data);
                    if (data.success) {
                        //window.location.href = data;
                    } else {
                        //window.location.href = data;
                    }
                }
            });
        });
    });
});
</script>

_ErrorsModal Частичное представление

@model Company.NotificationPattern.Notification
<!-- Modal -->
<div id="errorsModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title float-left">Warning</h4>
                <button type="button" class="close" data-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                @if (Model.HasErrors || Model.HasWarnings) {
                    <p>@Model.GetConcatenatedErrorMessage(Environment.NewLine + Environment.NewLine)</p>
                }
            </div>
            <div class="modal-footer">
                <button type="button" id="modalConfirm" class="btn btn-primary" data-dismiss="modal">OK</button>
            </div>
        </div>
    </div>
</div>

1 Ответ

1 голос
/ 13 марта 2020

Вы можете достичь этого различными способами, один из вариантов:

  • В методе поста вашего контроллера верните json, когда он проходит, и частичное, если он не работает.
  • В пределах ваш jquery $. ajax после проверки для json и продолжайте, иначе передайте результат вашему модальному

В вашем случае, json, возвращенный при проходе, будет указывать URL-адрес представление для перенаправления (не само представление, иначе нет способа узнать, является ли оно новым представлением или частичной ошибкой). например,

if (save() == false)
{
    return PartialView("_ErrorsModal", notification);
}
else {
    return Json({ 
        success = true, 
        url = this.Url.Action("SaveDailyCriteria", new { reportId = report.ReportId }
    });
}

и ваш javascript to:

$.ajax({
    type: 'POST',
    ...
    success: function (data) {
        if (data.success) 
            window.location.href = data.url;
        else
            $("#modalId").html(data);
    }
});

альтернатива - всегда возвращать json, но визуализировать _ErrorsModal (при ошибке) или View (при успехе) в контроллер в строку и добавьте эту строку как свойство json. ИМО лучше разрешить конвейеру MVC обрабатывать рендеринг до HTML, поэтому рекомендуем использовать вышеуказанный подход.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...