在编辑器模板列表上的ASPNET CustomValidation,在嵌套字段上添加input-validation-error css类

时间:2018-02-02 18:25:22

标签: c# asp.net-mvc razor

如何让我的编辑器模板字段在集合字段属性上应用.input-validation-error css类进行自定义验证?

通常我会在视图模型属性上直接添加装饰器,但在这种情况下,验证属性位于集合的父视图模型上。

我尝试应用类似于此处给出的答案: https://stackoverflow.com/a/8573879/181473

以下是集合属性上自定义验证属性的示例:

public class ParentViewModel
{
    public ParentViewModel()
    {
        Quantities = new List<Quantity>();
    }

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

    [CustomValidation(typeof(ParentViewModel), "ValidateQuantities")]
    public List<Quantity> Quantities { get; set; }

    public static ValidationResult ValidateQuantities(List<Quantity> quantities , ValidationContext context)
    {
        ValidationResult result = null;

        ParentViewModel vm = (ParentViewModel)context.ObjectInstance;

        if (quantities.Sum(m => m.Amount) != 21)
        {
            var memberNames = new List<string>();
            for (int i = 0; i < quantities.Count; i++)
            {
                string memberName = context.MemberName + "[" + i.ToString() + "]." + nameof(Quantity.Amount);
                memberNames.Add(memberName);
            }

            // Not working, adding member name to result does not work:
            result = new ValidationResult("Amounts must add up to 21.", memberNames);
        }

        return result;
    }
}

public class Quantity
{
    public int? Id { get; set; }

    [Required]
    public int? Amount { get; set; }
}

这是我的控制器:

public class FormController : Controller
{
    [HttpGet]
    public ActionResult Index()
    {
        var viewModel = new ParentViewModel();

        viewModel.Quantities = new List<Quantity>()
        {
            new Quantity(){ Id = 1000 },
            new Quantity(){ Id = 1001 },
            new Quantity(){ Id = 1002 },
        };

        return View(viewModel);
    }

    [HttpPost]
    public ActionResult Index(ParentViewModel viewModel)
    {
        ModelState.Clear();
        TryValidateModel(viewModel);

        for (int i = 0; i < viewModel.Quantities.Count; i++)
        {
            string prefix = nameof(viewModel.Quantities) + "[" + i.ToString() + "]";
            TryValidateModel(viewModel.Quantities[i], prefix);
        }

        return View(viewModel);
    }
}

这是Form razor模板:

@* Views/Form/Index.cshtml *@
@model Mvc5App.Controllers.ParentViewModel

<style>
    .input-validation-error {
        background: red;
    }
</style>
<br>

@using (Html.BeginForm("Index", "Form", FormMethod.Post))
{
    @Html.ValidationSummary();

    @Html.LabelFor(m => m.Title)
    @Html.TextBoxFor(m => m.Title)
    <br>

    for (int i = 0; i < Model.Quantities.Count; i++)
    {
        @Html.EditorFor(m => m.Quantities[i], "Form/EditorTemplates/Quantity");
        <br>
    }

    <button type="submit" name="SubmitAction" value="SubmitAction" class="btn btn-primary">Submit</button>
}

这是编辑器模板:

@* Views/Form/EditorTemplates/Quantity.cshtml *@
@model Mvc5App.Controllers.Quantity

@Html.HiddenFor(m => m.Id)
@Html.LabelFor(m => m.Amount)
@Html.TextBoxFor(m => m.Amount)

当我在POST路由中调用TryValidateModel(viewModel);时,&#34; ParentViewModel.Title&#34;字段获取应用的类,将背景颜色更改为红色。

但所有&#34; ParentViewModel.Quantities&#34;金额字段不会获得.input-validation-error css类,我猜这意味着ModelState不会意识到这些字段存在问题。

如果自定义验证结果未通过验证,如何将所有金额字段变为红色?

0 个答案:

没有答案