data-val-required不起作用,除非其他验证器开始工作

时间:2015-08-07 13:59:50

标签: jquery html model-view-controller unobtrusive-validation

我有一个带有必填字段验证器和其他自定义验证适配器的INPUT字段,

 @Html.TextBoxFor(t => t.SomeClass.Name, new
                {

                    data_val = "true",
                    data_val_required = "Required Field Message",
                    data_val_customvalidator1 = "Message1",
                    data_val_customvalidator2 = "Message2",
                })

我遇到的问题是,除非任何其他验证工具正常工作,否则必填字段验证器无效

情景: -

步骤1:用户输入1234,标签外的字段并验证字段 步骤2:选择在上述字段中输入的数据并按删除 第3步:必填字段验证工具

但是当用户返回填充了数据且已经过验证的字段并开始一次删除一个字符时,该字段的其他自定义验证器开始工作并使该字段无效

现在,如果用户输入正确的数据并且选项卡输出字段得到验证,但现在当用户完全删除数据时,如上面的步骤2所示,字段验证开始工作!!!

所以我无法理解为什么必要的字段验证器在其他验证器工作之前不起作用。

2 个答案:

答案 0 :(得分:0)

我只需添加一行代码就可以解决这个问题

jQuery.validator.setDefaults({
                    onfocusout: function(element) {
                        $(element).valid();
                    }); 

答案 1 :(得分:0)

可能有点矫枉过正,但这是在我的情况下有效的方法(我放弃了使验证方法有效 - submitHandler 和所有其他方法对我都不起作用):

$(document).ready(function () {
    $(':input[data-val]').bind('propertychange change click keyup input paste', function () {
        var $element = $(this);
        if ($element.valid()) {
            unhilightErrors($element);
        }
        else {
            hilightErrors($element);
        }
    });
    $('form').on('submit', function (e) {
        e.preventDefault();
        var $form = $(this);
        if ($form.valid()) {
            var $button = $form.find(':submit');
            var loadingDelay = setTimeout(function () {
                $button.button('loading');
            }, 100);
            var formValues = $form.serialize();
            $.post($button.data('local-ajax'), formValues, function () {
                clearTimeout(loadingDelay);
                window.location.reload();
            });
        }
        else {
            hilightErrors();
        }
    });
    function hilightErrors($selector = undefined) {
        if ($selector && $selector.is(':input')) {
            $selector.addClass('alert-danger').removeClass('input-validation-error');
        }
        else {
            $(':input.input-validation-error').addClass('alert-danger').removeClass('input-validation-error');
            $(':input.field-validation-error').addClass('alert-danger').removeClass('field-validation-error');
        }
    }
    function unhilightErrors($selector = undefined) {
        if (!$selector) {
            $selector = $(':input.alert-danger[data-val]');
        }
        $selector.removeClass('alert-danger');
    }
});