Пользовательское сообщение об ошибке атрибута проверки отображается до проверки - PullRequest
Новая
       27

Пользовательское сообщение об ошибке атрибута проверки отображается до проверки

0 голосов
/ 18 марта 2019

Я пытаюсь использовать настраиваемый атрибут проверки, чтобы флажок заканчивался. Тем не менее, ошибка проверки отображается (не стилизовано) как часть метки флажка до запуска проверки.

К деталям:

У меня есть следующее свойство и атрибут: 

[Display(Name = "TermsAndConditions", ResourceType = typeof(Res.Labels))]
[MustBeTrue(ErrorMessageResourceName = "TermsAndConditionsValidationMessage", ErrorMessageResourceType = typeof(Res.Labels))]
public bool TermsAndConditions { get; set; } = true;

(по тем или иным причинам. Значение по умолчанию true является преднамеренным. Оно переключается обратно на false в представлении): 

@model MyModel
@{ 
        MyModel.TermsAndConditions = false;
}

Пользовательский атрибут выглядит следующим образом: 

public class MustBeTrueAttribute : ValidationAttribute, IClientValidatable
    {
        public override bool IsValid(object value)
        {
            return value is bool && (bool)value;
        }

        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
        {
            yield return new ModelClientValidationRule
            {       
                ErrorMessage = FormatErrorMessage(Labels.TermsAndConditions),
                ValidationType = "mustbetrue"
            };
        }
    }

HTML в представлении выглядит следующим образом: 

<div class="checkbox">
    @Html.CheckBoxFor(m => m.TermsAndConditions, true)
    <div class="state">
        <label for="terms">
            @Html.Raw(Label.TermsAndConditions)
            @Html.ValidationMessageFor(m => m.TermsAndConditions, Label.TermsAndConditionsValidationMessage)
        </label>
    </div>
</div>

HTML.Raw используется, так как мне нужен ярлык для отображения элемента привязки, я не смог найти другой способ сделать это.

Сгенерированный HTML при загрузке страницы выглядит так: 

<div class="checkbox">

    <input data-msg-mustbetrue="You must accept the terms and conditions" data-msg-required="The I aceept the <a href=&quot;#&quot;>terms and conditions</a>. field is required." data-rule-mustbetrue="true" data-rule-required="true" id="TermsAndConditions" name="TermsAndConditions" type="checkbox" value="true">
    <input name="TermsAndConditions" type="hidden" value="false">
    <div class="state">
        <label for="terms">
            I aceept the <a href="#">terms and conditions</a>.
            <span class="field-validation-valid" data-valmsg-for="TermsAndConditions" data-valmsg-replace="false">You must accept the terms and conditions</span>
        </label>
    </div>
</div>

termsAndConditionsPreValidation

После запуска проверки все работает как положено: 

<div class="checkbox">
    <input data-msg-mustbetrue="You must accept the terms and conditions" data-msg-required="The I aceept the <a href=&quot;#&quot;>terms and conditions</a>. field is required." data-rule-mustbetrue="true" data-rule-required="true" id="TermsAndConditions" name="TermsAndConditions" type="checkbox" value="true" class="input-validation-error">
    <input name="TermsAndConditions" type="hidden" value="false">
    <div class="state">
        <label for="terms">
            I aceept the <a href="#">terms and conditions</a>.
            <span class="field-validation-error" data-valmsg-for="TermsAndConditions" data-valmsg-replace="false">You must accept the terms and conditions</span>
        </label>
    </div>
</div>

termsAndCondtionsAfterValidation

Я уже некоторое время бьюсь головой об стену с этим материалом, кто-нибудь может указать мне правильное направление? Пожалуйста и спасибо.

1 Ответ

0 голосов
/ 19 марта 2019

Я наконец-то решил это после того, как ударился головой о стену.

Этот конкретный случай связан с отсутствием CSS.Это нормально, ошибка на странице, она должна быть просто скрыта для начала.Это единственное место, где используется пользовательский атрибут, поэтому мне никогда не приходило в голову, что это будет CSS, так как все остальные проверки выполняются. 

span.field-validation-valid {
        display: none;
}

и вуаля, отсортировано.

...