如何在MVC中的对象的必需列表<>上获得不显眼的客户端验证？

Question

我有一个雇员包含功能列表的模型。员工至少应该有一个功能。

public class Employee 
{ 
    [Required(ErrorMessage = "Name is Required")] 
    public string Name { get; set; } 

    [Required(ErrorMessage = "Email is Required")] 
    [RegularExpression(@"^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}" + 
         @"\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\" + 
         @".)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$", 
     ErrorMessage = "Email is not valid")] 
    public string Email { get; set; } 

    [Required(ErrorMessage = "At least one function is required")] 
    public List<Function> Functions { get; set; } 
} 

public class Function 
{ 
    [Required(ErrorMessage = "Name is Required")] 
    public string Name { get; set; } 
} 

我创建了一个EditorTemplate的功能

@model MvcClientSideValidation.Models.Function 

    <fieldset> 
     <legend>Functie</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> 

    </fieldset> 

索引视图使用EditorFor和ValidationMessageFor。

@Html.EditorFor(m => m.Functions) 
@Html.ValidationMessageFor(m => m.Functions) 

视图还包含添加或删除函数的代码。

提交视图时，客户端验证不会检查函数是否存在。服务器端验证确实。问题是当列表为空时，没有为Function属性呈现输入元素，因此没有可以添加验证标签的标签。

因此，我正在寻找一种简单的方法来对List和[Required]属性进行不显眼的客户端验证。

编辑：我刚刚意识到[必需的]属性可能只会验证Function不是null。它不会检查它是否包含任何项目。这对我来说很好，因为该属性将在回发时自动变为null。

Answer 1

我认为你的问题是你让列表为空。如果它确实需要一个函数存在，那么从列表中的1个项目开始，没有选择任何项目。不要让您的代码添加或删除项目以删除最后一个项目，因此总是会有至少一个项目，并且验证应该可以工作。

Answer 2

尝试这种情况：

[RequiredEnumerable(ErrorMessage = "At least one function is required")] 
[UIHint("FunctionCollection")] // -> EditorTemplate partial view, it ensures that the input is generated. 
public List<Function> Functions { get; set; } 

RequiredEnumerable类：

public class RequiredEnumerableAttribute : ValidationAttribute, IClientValidatable 
{ 
    public override bool IsValid(object value) 
    { 
     var enumerable = value as IEnumerable; 
     if (enumerable == null) return false; 

     IEnumerator enumerator = enumerable.GetEnumerator(); 
     if (enumerator.MoveNext()) 
      return true; 
     return false; 
    } 

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) 
    { 
     yield return new ModelClientValidationRule { ValidationType = "requiredenumerable", ErrorMessage = ErrorMessageString }; 
    } 
} 

FunctionCollection局部视图（/Views/Shared/EditorTemplates/FunctionCollection.cshtml）：

@model IEnumerable<Function> 
@{ 
    Function[] models = Model != null ? Model as Function[] ?? Model.ToArray() : new Function[0]; 
    string value = Newtonsoft.Json.JsonConvert.SerializeObject(models.Select(x => x.Name)); 
} 
@Html.Hidden(String.Empty, value) 
@Html.ValidationMessage(String.Empty) 
@if (models.Any()) 
{ 
    <ul> 
     @foreach (Function f in models) 
     { 
      <li>@f.Name</li> 
     } 
    </ul> 
} 
@Ajax.ActionLink("Edit functions", "Index", "Function", new { selectedFunctions = value }, new AjaxOptions { }) 

在JavaScript

：

<script> 
    // create and append method 'requiredenumerable' to $.validator (before $.ready) 
    $.validator.addMethod("requiredenumerable", function (value) { 
     value = $.trim(value); 
     if (!value.length) return false; 

     //assumes that value is either a json array or a string of comma separated values​​ 
     var arr = value.indexOf("[") === 0 ? $.parseJSON(value) : value.split(","); 
     return arr && arr.length > 0; 
    }); 
    $.validator.unobtrusive.adapters.addBool("requiredenumerable"); 

    // as #Functions input is hidden so we need adapt the validator object (inside $.ready) 
    $(document).ready(function() { 
     var elemSelector = "#Functions"; 
     var validator = $(elemSelector).closest("form").data("validator"); 
     if (validator) { 
      validator.settings.ignore = ":hidden:not(" + elemSelector + ")"; 
     } 
    }); 
</script>