1

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

我的问题是，有没有办法使用内置的 MVC 验证来验证使用这种方法添加的记录。我已经向我的模型添加了数据注释属性，但是因为我正在为客户端上的每条新记录生成 html，所以我无法使用通常使流程正常工作的 html 帮助程序。

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

4

1 回答 1

0

例如： View 有两种形式：form1 和 form2。</p>

form1 有两部分。

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

第二部分：有一个。

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

[HttpPost] Action Create 有一个参数 List 模型。

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

模型

public class HomeModel
{
    [Required]
    public string Name { get; set; }

    [Required]
    public string Number { get; set; }
}

控制器：

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

查看：</p> 

@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>
}

示例下载

于 2012-10-16T19:07:43.610 回答