Asp.net mvc 对客户端上创建的记录使用内置验证

我有一个ASP.NET MVC4应用程序，允许用户使用javascript模板在客户端的多个记录中添加1。它工作正常，并且使用正确的命名约定，模型绑定将post数据正确地转换为action方法所需的对象集合

我的问题是，有没有办法对使用这种方法添加的记录使用内置MVC验证。我已经在模型中添加了数据注释属性，但是因为我正在为客户机上的每个新记录生成html，所以我不能使用html帮助程序来帮助处理

显然，我可以自己添加客户端验证，让数据注释在服务器上验证，但我想知道是否有一种方法可以利用这种方法的内置验证堆栈，以便我可以在服务器上维护所有验证逻辑。

例如： 视图有两种形式：form1和form2

表格1分为两部分

第一部分： 有两个文本框、一个创建按钮和一个保存按钮

第二部分： 有一个

因此，当我们填写两个文本框并按下创建按钮时，如果未通过验证，则显示错误消息。 如果通过验证，则将值插入到中，并将值插入到表单2中

[HttpPost]操作创建有一个参数列表模型

当我们按下Save按钮时，会将form2的值映射到控制器列表模型

模型

控制器：

    [HttpPost]
    public ActionResult Create(List<HomeModel> models)
    {
        // TODO: Add insert logic here
    }    

视图：

@model MvcApplication1.Models.HomeModel
@{
   ViewBag.Title = "Create";
 }

<h2>Create</h2>

@using (Html.BeginForm("Create", "Home", FormMethod.Post, new { id = "form1" }))
{
@Html.ValidationSummary(true)

<fieldset>
    <legend>HomeModel</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Name)
        @Html.ValidationMessageFor(model => model.Name)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Number)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Number)
        @Html.ValidationMessageFor(model => model.Number)
    </div>

    <p>
        <input type="submit" value="Create" id="btnCreate" />
        <input type="button" value="Save" id="btnSave" />
    </p>
</fieldset>
<table id="tb"></table>
}

<div id="FormInfo" style="display: none;">
    <form action="/Home/Create" id="form2" method="post"></form>
</div>

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script type="text/javascript">
        $(function () {
            $("#form1").submit(function () {
                var ErrorLength = $(".field-validation-error").length;
                if (ErrorLength <= 0) {
                    var nameValue = $("#Name").val();
                    var numberValue = $("#Number").val();
                    InsertToForm2(nameValue, numberValue);
                    InsertToTable(nameValue, numberValue);
                }
                return false;
            });

            $("#btnSave").click(function () {
                $("#form2").submit();
            });
        });

        function InsertToForm2(nameValue, numberValue) {
            var inputCount = $("#form2 input").length / 2;
            var combineHTML = "<input type='text' name='models[" + inputCount + "].Name' value='" + nameValue + "' /> ";
            combineHTML += "<input type='text' name='models[" + inputCount + "].Number' value='" + numberValue + "'/> ";
            $("#form2").append(combineHTML);
        }

        function InsertToTable(nameValue, numberValue) {
            var combineHTML = "<tr><td>" + nameValue + "</td><td>" + numberValue + "</td></tr>";
            $("#tb").append(combineHTML);
        }
    </script>
}

---

不管怎样，服务器端验证都应该有效。不过，客户端验证需要正确的属性。你必须自己添加这些。但是服务器端验证没有任何访问权限，所以我不确定您为什么会遇到问题。您是如何绑定对象的？我对服务器端验证没有任何问题，这在您的问题中是不清楚的。你让人觉得验证根本不起作用。是的，如果在客户端进行验证，则必须手动添加验证属性。

@model MvcApplication1.Models.HomeModel
@{
   ViewBag.Title = "Create";
 }

<h2>Create</h2>

@using (Html.BeginForm("Create", "Home", FormMethod.Post, new { id = "form1" }))
{
@Html.ValidationSummary(true)

<fieldset>
    <legend>HomeModel</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Name)
        @Html.ValidationMessageFor(model => model.Name)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Number)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Number)
        @Html.ValidationMessageFor(model => model.Number)
    </div>

    <p>
        <input type="submit" value="Create" id="btnCreate" />
        <input type="button" value="Save" id="btnSave" />
    </p>
</fieldset>
<table id="tb"></table>
}

<div id="FormInfo" style="display: none;">
    <form action="/Home/Create" id="form2" method="post"></form>
</div>

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script type="text/javascript">
        $(function () {
            $("#form1").submit(function () {
                var ErrorLength = $(".field-validation-error").length;
                if (ErrorLength <= 0) {
                    var nameValue = $("#Name").val();
                    var numberValue = $("#Number").val();
                    InsertToForm2(nameValue, numberValue);
                    InsertToTable(nameValue, numberValue);
                }
                return false;
            });

            $("#btnSave").click(function () {
                $("#form2").submit();
            });
        });

        function InsertToForm2(nameValue, numberValue) {
            var inputCount = $("#form2 input").length / 2;
            var combineHTML = "<input type='text' name='models[" + inputCount + "].Name' value='" + nameValue + "' /> ";
            combineHTML += "<input type='text' name='models[" + inputCount + "].Number' value='" + numberValue + "'/> ";
            $("#form2").append(combineHTML);
        }

        function InsertToTable(nameValue, numberValue) {
            var combineHTML = "<tr><td>" + nameValue + "</td><td>" + numberValue + "</td></tr>";
            $("#tb").append(combineHTML);
        }
    </script>
}