在视图中验证没有BeginForm的多个部分视图

Question

我有一个View (Index.cshtml)它有两个模态(Bootstrap模态).

我有一个装Partial View在每个modal.所以在这里View,我有两个Partial Views(AddContractHistory.cshtml和AddCompany.cshtml).

我有一个模型,它的字段应该在每个中验证Partial Views.我需要分别验证每个部分视图.

在相同的其他问题,Html.BeginForm被使用,但我对工作MVC模块和DNN 8是Html.BeginForm或Ajax.Html.BeginForm不被支持.

为了完成这项工作而没有BeginForm,我测试了许多方法,如下面但我不能正确地做到这一点.

ASP.NET MVC验证组？

ASP.NET MVC在一个页面中的多个表单:验证不起作用

Index.cshtml(查看)

@using MyProject.BusinessLogic
<div class="form-group">
    <div class="col-sm-12">
        <button type="button" class="btn btn-success" onclick="$('#AddContractHistory').modal('show');">
            <i class="fa fa-plus"></i>
            New ContractHistory
        </button>
    </div>
    <div class="col-sm-12">
        <button type="button" class="btn btn-success" onclick="$('#AddCompany').modal('show');">
            <i class="fa fa-plus"></i>
            New Company
        </button>
    </div>
</div>

<div id="AddContractHistory" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg" id="mymodal">
        @Html.Partial("AddContractHistory", new ContractHistory())
    </div>
</div>
<div id="AddCompany" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg" id="mymodal">
        @Html.Partial("AddCompany", new Company())
    </div>
</div>

AddContractHistory.cshtml(PartialView)

@inherits DotNetNuke.Web.Mvc.Framework.DnnWebViewPage<MyProject.BusinessLogic.ContractHistory>

<div id="myform">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">contract</h4>
        </div>
        <div class="modal-body">
            <div class="row">
                <div class="panel-body">
                    <div class="form-horizontal">
                        @Html.ValidationSummary()
                        @Html.HiddenFor(c => c.ID)
                        <div class="form-group">
                            <div class="col-sm-6">
                                @Html.LabelFor(c => c.PlaceName)
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-file-text-o" aria-hidden="true"></i>
                                    </span>
                                    @Html.EditorFor(c => c.PlaceName, new { htmlAttributes = new { @class = "form-control requierd-field" } })
                                </div>
                            </div>
                            <div class="col-sm-6">
                                @Html.LabelFor(c => c.ActivityDescription)
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-file-text-o" aria-hidden="true"></i>
                                    </span>
                                    @Html.EditorFor(c => c.ActivityDescription, new { htmlAttributes = new { @class = "form-control requierd-field" } })
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-success" formaction="AddContractHistory">
submit
            </button>
            <button type="button" class="btn btn-default" data-dismiss="modal">cancel</button>
        </div>
    </div>
</div>

AddCompany.cshtml(PartialView)

@inherits DotNetNuke.Web.Mvc.Framework.DnnWebViewPage<MyProject.BusinessLogic.Company>

<div id="myform">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Company</h4>
        </div>
        <div class="modal-body">
            <div class="row">
                <div class="panel-body">
                    <div class="form-horizontal">
                        @Html.ValidationSummary()
                        @Html.HiddenFor(c => c.ID)
                        <div class="form-group">
                            <div class="col-sm-6">
                                @Html.LabelFor(c => c.PlaceName)
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-file-text-o" aria-hidden="true"></i>
                                    </span>
                                    @Html.EditorFor(c => c.PlaceName, new { htmlAttributes = new { @class = "form-control requierd-field" } })
                                </div>
                            </div>
                            <div class="col-sm-6">
                                @Html.LabelFor(c => c.ActivityDescription)
                                <div class="input-group">
                                    <span class="input-group-addon">
                                        <i class="fa fa-file-text-o" aria-hidden="true"></i>
                                    </span>
                                    @Html.EditorFor(c => c.ActivityDescription, new { htmlAttributes = new { @class = "form-control requierd-field" } })
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-success" formaction="AddCompany">
                submit
            </button>
            <button type="button" class="btn btn-default" data-dismiss="modal">cancel</button>
        </div>
    </div>
</div>

提前致谢!

Answer 1

您可以用另一种方式实现您的Html.BeginForm，但它在 中不受支持Dotnetnuke。

1. 更改按钮属性

您应该更改buttons，这会导致将数据发布到操作，如下所示：

<button id="btnAddContractHistory" type="button" class="btn btn-success">
    submit
</button>

<button id="btnAddCompany" type="submit" class="btn btn-success">
    submit
</button>

2.添加事件点击按钮

两个点击事件需要提供数据来执行所需的操作。在这些事件中，url属性action被form您更改url，然后导致form.submit()将数据（模型）传递给相关操作。最后，您将在两个不同的操作中验证属性值。

<script>

    $('.modal').find('#btnAddContractHistory').on('click', function () {
        var url = 'AddContractHistory action url'; // It depends on your AddContractHistory action url
        var form = $(this).closest('form');
        form.prop('action', url);
        form.submit();
    });

    $('.modal').find('#btnAddCompany').on('click', function () {
        var url = 'AddCompany action url'; // It depends on your AddCompany action url
        var form = $(this).closest('form');
        form.prop('action', url);
        form.submit();
    });

</script>