1

つまり、私のビューでは、コレクションからの最初のオブジェクトの入力に対してのみ、データ検証属性が追加されます。ビューでコレクションの任意のオブジェクトの入力を検証できるようにしたいと考えています。私は Asp.net MVC4、jquery.validate.unobtrusive を使用しています。

詳細: 私のプロジェクトには、すべての製品カテゴリを表示したい管理ページがあります。このカテゴリはすべて編集できます。編集プロセスの最後に、ユーザーはボタンをクリックしてすべての変更を保存できます。

私のビューモデル:

public class CategoriesManagementViewModel
{
    [Required(ErrorMessage = Validation.FieldRequiredMsg)]
    public int Id { get; set; }

    [Required(ErrorMessage = Validation.FieldRequiredMsg)]
    [StringLength(50, ErrorMessage = Validation.MaxLength50Msg)]
    public string Name { get; set; }

    [Required(ErrorMessage = Validation.FieldRequiredMsg)]
    [Range(0, int.MaxValue, ErrorMessage = Validation.PositiveNumberMsg)]
    public int AmountForDiscount { get; set; }

    [Required(ErrorMessage = Validation.FieldRequiredMsg)]
    [Range(0, 100, ErrorMessage = Validation.PercentMsg )]
    public int DiscountPercent { get; set; }

    public bool IsActive { get; set; }
}

ここにコントローラーがあります：

public JsonResult GetProductCategories(int currentPage)
    {
        using (var service = new DalServiceSoapClient())
        {
            var data = service.GetProductCategories(currentPage, Constants.ItemsOnPage,false)
                .Select(x=> new CategoriesManagementViewModel(x));
            var html = RenderRazorViewToString("_ManageCategoriesPartial", data);
            return Json(new { status = "success", html = html });
        }

    }

コントローラーでは、db からデータを取得し、それを ViewModel のコレクションに変換して、部分ビューに渡します。部分的なビューが html 文字列にレンダリングされ、json として送信され、ビューの一部が更新されます。

ここに部分的なビューがあります:

@model IEnumerable<GreenLightShop.Models.CategoriesManagementViewModel>
@{
    Layout = null;
    var i = 0;
}

@foreach (var item in Model)
{
    var blockedClass = "";    
    var blockBtnCaption = "Block";

if (!item.IsActive)
{
    blockedClass = "blocked";
    blockBtnCaption = "UnBlock";
}

<div class='box @blockedClass' itemid="@item.Id" ischanged="false" isactive     ="@item.IsActive">

    <div class="show">
        <span>@item.Name</span>
        |&nbsp;<a href="#" class="edit-category-btn">Edit Category</a>
        |&nbsp;<a href="#" class="edit-products-btn">Edit Product</a>
        |&nbsp;<a href="#" class="block-btn"> @blockBtnCaption </a> |&nbsp;
    </div>
    <form class="edit hidden">

        <div class="form-field">
            <label> Name:</label>
            @Html.TextBoxFor(x => x.ElementAt(i).Name)
         @*   @Html.HiddenFor(x=>x.ElementAt(i).Name)*@
            <div>
                @Html.ValidationMessageFor(x => x.ElementAt(i).Name)    
            </div>
        </div>

        <div class="form-field">
            <label> Amount For Discount:</label>
            @Html.TextBoxFor(x => x.ElementAt(i).AmountForDiscount)
           @* @Html.HiddenFor(x => x.ElementAt(i).AmountForDiscount)*@
            <div>
                @Html.ValidationMessageFor(x => x.ElementAt(i).AmountForDiscount)    
            </div>
        </div>

        <div class="form-field">
            <label> Discount:</label>
            @Html.TextBoxFor(x => x.ElementAt(i).DiscountPercent)
           @* @Html.HiddenFor(x => x.ElementAt(i).DiscountPercent)*@
            <div>
                @Html.ValidationMessageFor(x => x.ElementAt(i).DiscountPercent)    
            </div>
        </div>

        <input type="button" class="accept-changes-btn" value="Apply"/>
        <input type="button" class="cancel-changes-btn" value="Cancel"/>
    </form>
</div>

    i++;
}

の最初の要素では IEnumerable<GreenLightShop.Models.CategoriesManagementViewModel>、フォームの各入力に検証属性が追加されます。

<input id="Name" type="text" value="CategoryName" name="Name" data-val-required="This field is required." data-val-length-max="50" data-val-length="Not longer than 50 characters." data-val="true">.

検証は正常に機能します。

他のすべてのカテゴリの入力については、検証属性は追加されません。

<input id="Name" type="text" value="AnotherCategory" name="Name">

ユーザーがクリックしたとき

<input type="button" class="accept-changes-btn" value="Apply"/>`,

変更されたカテゴリの入力フィールドを解析しています$.validator.unobtrusive.parse($(this));

すべてのカテゴリが正常に表示され、変更を送信すると Model.IsValid が正常に機能し、データ バインディングも機能します。

各カテゴリの検証を行うにはどうすればよいですか?

前もって感謝します。

4

1 に答える 1