2

에서 적어도 하나의 I가 배열 값을 제출 한 경우의 유효성을 검사하는 데 사용되는 다음과 같은 사용자 지정 특성 :사용자 정의 클라이언트 측 검증에 필요한 배열

[RequiredArray(ErrorMessage = "Please select at least one product")] 
public IEnumerable<string> ProductIds { get; set; } 

[AttributeUsage(AttributeTargets.Property, AllowMultiple = true, Inherited = true)] 
public sealed class RequiredArrayAttribute : RequiredAttribute, IClientValidatable 
{ 
    public RequiredArrayAttribute() 
     : base() 
    { 
    } 

    public override bool IsValid(object value) 
    { 
     var list = (IList)value; 

     if (list != null && list.Count > 0) 
     { 
      return true; 
     } 

     return false; 
    } 

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) 
    { 
     string errorMessage = this.ErrorMessage; 

     // Get the specific error message if set, otherwise the default 
     if (string.IsNullOrEmpty(errorMessage) && metadata != null) 
     { 
      errorMessage = FormatErrorMessage(metadata.GetDisplayName()); 
     } 

     var clientValidationRule = new ModelClientValidationRule() 
     { 
      ErrorMessage = errorMessage, 
      ValidationType = "requiredarray" 
     }; 

     return new[] { clientValidationRule }; 
    } 
} 

이 적용 (jquery.js, 눈에 거슬리지-은 ajax.js, validate.js 및 validate.unobtrusive.js 후 포함) 다음 JS

(function ($) { 
    $.validator.addMethod('requiredarray', function (value, element, params) { 
     var selector = 'input[name=' + $(element).attr('name') + ']:checked'; 
     return $(selector).length > 0; 
    }, 'Clientside Should Not Postback'); 

    $.validator.unobtrusive.adapters.addBool('requiredarray'); 
})(jQuery); 

addMethodreturn false;으로 변경해 보았습니다.하지만 여전히 아무런 문제가 없습니다. (내 콘솔에는 오류가 없습니다)

위의 코드를 잘못 처리 한 사람이 있는지 궁금합니다. 주소 속성을 사용하여 비슷한 결과를 얻었지만 제대로 작동하지만 어떤 이유로 작동하지 않습니다.

이 외에도 서버 측 유효성 검사가 작동합니다. 렌더링 확인란에 확인 메시지

면도기 코드

@Html.ValidationMessageFor(m => m.ProductIds) 

예 HTML :

<input type="checkbox" class="checkbox" name="ProductIds" value="EXAMPLEID1234" id="checkbox-1" checked="checked" /> 
<input type="checkbox" class="checkbox" name="ProductIds" value="EXAMPLEID1235" id="checkbox-2" checked="checked" /> 

편집이에 더

나는 지금을 사용하여 작업 할 수있는 클라이언트 측 유효성 검사를 얻을 수 있습니다 다음

$.validator.addClassRules('required-group', { 'requiredarray': true }); 

위의 validator.unobtrusive.adapters.addBool 방법 대신에. 또한 체크 박스에 required-group 클래스를 추가했습니다.

그러나이 코드를 사용하면 적절한 MVC 오류 메시지가 추가되지 않고 위 코드에 설정된대로 Clientside Should Not Postback이 추가됩니다. 나는 체크 박스에 다음 속성을 추가 시도 :

data-val="true" data-val-required="Please select at least one sample" 

data-val-requiredarray를 사용하여 시도하지만이 차이가 있으므로 누구나가 MVC 오류 메시지를 사용하기 위해 위의 클라이언트 측 규칙을 변경하는 방법을 알고하지 않을 수 있습니다

+0

관련된 모든 항목에 _rendered_ 코드를 표시하십시오. 렌더링 된'.validate()'메소드는 어디에 있습니까? 전체 양식에 대해 렌더링 된 HTML은 어디에 있습니까? – Sparky

+0

@ Sparky MVC가 모든 유효성 검사를 처리하므로 전체 양식에 대한 코드가 없으므로 끝에 제출 버튼이있는 동일한 체크 박스가 많이 있습니다. – Pete

+0

그 사실을 알고 있습니다.그러나 jQuery Validate는 여전히 JavaScript이므로 초기화하지 않고 실행할 수 없습니다. 초기화 메소드는'.validate()'입니다. 그래서'.validate()'메소드가 클라이언트 쪽 어딘가에서 렌더링되어야합니다 ... 아마도 포함 된 js 파일에있을 것입니다. – Sparky

답변

1

는 그래서는 HTML을 다음과 같이 변경으로 수정되었습니다 :

<input type="checkbox" class="checkbox required-group" name="ProductIds" value="EXAMPLEID1234" id="checkbox-1" checked="checked" data-val-required="Please select at least one sample" /> 
<input type="checkbox" class="checkbox required-group" name="ProductIds" value="EXAMPLEID1235" id="checkbox-2" checked="checked" /> 

data-val-required은 배열의 첫 번째 체크 박스에 있어야합니다. 그런 다음 jQuery를 사용하여 : 나는 addClassRulesaddBool을 변경 한 후 오류 메시지를 설정 $.validator.messages을 사용했다

(function ($) { 
    $.validator.addMethod('requiredarray', function (value, element, params) { 
     return $('input[name=' + $(element).attr('name') + ']:checked').length > 0; 
    }, 'Please select at least one'); 

    $.validator.addClassRules('required-group', { 'requiredarray': true }); 

    var errorMessage = $('.required-group').eq(0).data('val-requiredarray'); 
    if (errorMessage && errorMessage !== "") { 
     $.validator.messages.requiredarray = errorMessage; 
    } 
})(jQuery); 

.