1

私は ASP.NET MVC4 アプリケーションを使用しており、ユーザーは JavaScript テンプレートを使用してクライアント上の多くのレコードに 1 を追加できます。それは正常に機能しており、適切な命名規則を使用しており、モデル バインディングはポスト データをアクション メソッドに必要なオブジェクトのコレクションに正しく変換しています。

私の質問は、このアプローチを使用して追加されたレコードに対して組み込みの MVC 検証を使用する方法があるかどうかです。モデルにデータ注釈属性を追加しましたが、クライアントで新しいレコードごとに html を生成しているため、通常はプロセスを機能させる html ヘルパーを使用できません。

明らかに、クライアント側の検証を自分で追加して、データ注釈をサーバー上で検証させることができますが、このタイプのアプローチに組み込みの検証スタックを利用して、すべての検証を維持できるようにする方法があるかどうか疑問に思っていますサーバー上のロジック。

4

1 に答える 1

0

例： View には form1 と form2 の 2 つのフォームがあります。</p>

form1 には 2 つの部分があります。

最初の部分： 2 つのテキスト ボックスと、[作成] ボタンと [保存] ボタンがあります。

後編： あります。

したがって、2 つのテキスト ボックスに入力して [作成] ボタンを押すと、検証に合格しない場合はエラー メッセージが表示されます。検証に合格した場合は、フォームに値を挿入し、フォームに値を挿入します2.

[HttpPost] Action Create にはパラメーター リスト モデルがあります。

[保存] ボタンを押すと、フォーム 2 の値が取得され、リスト モデルへのコントローラー マッピングが行われます。

モデル

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 に答える