Asp.Net Core 2 MVC 部分视图中未显示验证错误消息

Question

我有一个包含 "workbooks" 标题列表的索引页，每个工作簿都有一个 "share" 按钮。当按下按钮时，会出现一个 bootstrap 模型（即对话框），其中显示工作簿的标题和一个允许用户输入共享电子邮件地址的文本区域。

当用户按下 "share" 按钮时，我正在调用一个 javascript 函数，该函数调用一个控制器操作，该控制器操作 returns 包含模态对话框的局部视图，内部有一个表单它。问题是在按下提交按钮（即 "Share"）后，没有向用户显示任何验证错误，我不确定为什么会这样。谁能提供一些想法吗？

这是我的主要（index.cshtml）页面：

@model DNAAnalysisCore.Models.WorkBookModel
@{
}

@section BodyFill
{
    <script type="text/javascript">

        function showSharingView(title) {
            var url = "@Url.Action("ShowShareDialog", "Home")" + "?workbookTitle=" + encodeURI(title);
            $('#shareFormContainer').load(url,
                function() {
                    $('#shareFormModal').modal("show");
                });
        }

        function hideSharingView() {
            $('#shareFormModal').modal("hide");
        }

    </script>

    <div id="shareFormContainer" >
       <!--PLACEHOLDER FOR SHARE DIALOG -->
    </div>

    <div class="workbook-container">
        <table class="table">
            <tbody>
            @foreach (var workbook in Model.Workbooks)
            {
                <tr>
                    <td>@Html.ActionLink(workbook.Name, "Open", "OpenAnalytics", new {id = Model.Id, workbook = workbook.Name})</td>
                    <td>
                        <button title="Share" class="share-button" onclick='showSharingView("@workbook.Name")'>&nbsp;</button>
                    </td>
                </tr>
            }
            </tbody>
        </table>
    </div>
}

那是我的控制器：

public class HomeController : Controller
{
    [HttpGet]
    public IActionResult ShowShareDialog(string workbookTitle)
    {
        var shareModel = new ShareModel
        {
            Title = workbookTitle
        };

        return PartialView("_ShareView", shareModel);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public IActionResult ShareWorkbook(string emails, string title)
    {
        var share = new ShareModel
        {
            Emails = emails
        };

        // TODO EMAIL THE SHARED WORKBOOK using the 'title' of the workbook and the 'email' string value

        // return no content to avoid page refresh
        return NoContent();
    }
}

这是我的部分 view/modal 对话框 (_ShareView):

@using DNAAnalysisCore.Resources
@model DNAAnalysisCore.Models.ShareModel

<!-- Modal -->
<div class="modal fade" id="shareFormModal" role="dialog">
    <div class="modal-dialog modal-md">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Share Workbook - @Model.Title</h4>

            </div>

            @using (Html.BeginForm("ShareWorkbook", "Home", FormMethod.Post))
            {
            <div class="modal-body">

                <label>@BaseLanguage.Share_workbook_Instruction_text</label>
                <div class="form-group">
                    <textarea class="form-control" asp-for="Emails" rows="4" cols="50" placeholder="@BaseLanguage.ShareDialogPlaceholder"></textarea>
                    @* TODO add client-side validation using jquery.validate.unobtrusive.js. See US268276 *@
                    <span asp-validation-for="Emails" class="text-danger"></span>
                </div>

                <input asp-for="Title" />
            </div>
            <div class="modal-footer">
                <button type="submit" onclick="hideSharingView()" class="btn btn-primary">Share</button>
                <button id="btnCancelDialog" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            </div>
            }

        </div>
    </div>
</div>


@section Scripts {
    @{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
}

这是我的 ShareModel:

public class ShareModel
{
    [HiddenInput]
    public string Title { get; set; }
    [Required]
    public string Emails { get; set; }
}

Answer 1

页面加载时表单不会添加到页面，非侵入式验证不会选择它up.A简单的解决方案是使用$.validator.unobtrusive.parse("#id-of-the-form");。参考here。

1.Add id 到您在 _ShareView 部分视图中的表单：

@using (Html.BeginForm("ShareWorkbook", "Home", FormMethod.Post,new { @id="partialform"}))

2.Introduce 验证文件 _ValidationScriptsPartial.cshtml 到主页（Index.cshtml）并手动注册表单以进行不显眼的验证。

@section Scripts
{
@await Html.PartialAsync("_ValidationScriptsPartial")
<script type="text/javascript">

    function showSharingView(title) {
        var url = "@Url.Action("ShowShareDialog", "Home")" + "?workbookTitle=" + encodeURI(title);
        $('#shareFormContainer').load(url,
            function() {
                $('#shareFormModal').modal("show");
                $.validator.unobtrusive.parse("#partialform");
            });
    }
    function hideSharingView() {
        $('#shareFormModal').modal("hide");
    }
</script>
}

Asp.Net Core 2 MVC 部分视图中未显示验证错误消息

Validation error message not displayed in Asp.Net Core 2 MVC partial view

validation

asp.net-core-mvc

asp.net-core-2.0