javascript bootstrapValidator:如何动态地向现有输入字段添加和删除验证器?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/25639287/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 04:47:03  来源:igfitidea点击:

bootstrapValidator: How do you add and remove validators dynamically to an existing input field?

javascriptjqueryknockout.jstwitter-bootstrap-3jqbootstrapvalidation

提问by Ole Viaud-Murat

I have a dynamic form that is bound with knockout.jsand validated by bootstrapValidator.

我有一个绑定了动态表单knockout.js,并通过验证bootstrapValidator

There is one input field that needs to be 'required-validated' dependent on the state of another control.

有一个输入字段需要根据另一个控件的状态进行“必需验证”。

The input field:

输入字段:

<textarea id="inputReason" name="inputReason" rows="3" 
          class="form-control col-lg-8"
          data-bind="value: Reason" />

The relevant javascript part of the knockout-viewmodel:

淘汰赛模型的相关 javascript 部分:

self.SelectAbsenceType = function (absenceType) {
    self.SelectedID(absenceType.ID);

    if (self.SelectedAbsenceType().ReasonRequired) {
        $('#formCreate').bootstrapValidator('addField', 'inputReason', {
            validators: {
                notEmpty: {
                    message: 'Please enter a reason'
                }
            }
        });
    } else {
        $('#formCreate').bootstrapValidator('removeField', 'inputReason');
    }
}

The problem I'm facing is that a call to removeFieldof the bootstrapValidatorinstance doesnt seem to completely remove all registration infos since there is a javascript exception in the updateStatusmethod of the bootstrapValidatorclass that in fact should not be called at all since I have the removed the field before:

我面临的问题是removeFieldbootstrapValidator实例的调用似乎并没有完全删除所有注册信息,因为类的updateStatus方法中有一个 javascript 异常bootstrapValidator,实际上根本不应该调用它,因为我删除了该字段前:

var that  = this,
    type  = fields.attr('type'),
    group = this.options.fields[field].group || this.options.group,
    total = ('radio' === type || 'checkbox' === type) ? 1 : fields.length;

The exception: Unable to get value of the property 'group': object is null or undefined

异常:无法获取属性“组”的值:对象为空或未定义

The variable fieldcontains the value 'inputReason'.

该变量field包含值“inputReason”。

So my Question is this (because the documentation of bootstrapValidators removeFieldis not entirely clear on this: How do I remove the dynamically added validation of the field inputReason completey?

所以我的问题是这样的(因为 bootstrapValidators 的文档removeField对此并不完全清楚:如何完全删除字段 inputReason 的动态添加验证?

(side note: can someone add the tag boostrapvalidator?)

(旁注:有人可以添加标签 boostrapvalidator 吗?)

回答by Ole Viaud-Murat

Ok, after some digging it seems that the bootstrapValidator Plugin simply doesnt yet support the removal of validators that are attached to an input field that is NOT to be removed in the same process. Thus the events that are attached to the input field that trigger the validation are not unregistered.

好吧,经过一番挖掘,似乎 bootstrapValidator 插件根本不支持删除附加到输入字段的验证器,该输入字段不会在同一过程中删除。因此,附加到输入字段的触发验证的事件不会被取消注册。

A temporary workaround is to destroy the bootstrapValidator instance, set the data-*attribute of the form to null and reinitialize the plugin. This code replaces the bootstrapValidator.removeField()call:

临时解决方法是销毁 bootstrapValidator 实例,将data-*表单的属性设置为 null 并重新初始化插件。此代码替换bootstrapValidator.removeField()调用:

bootstrapValidator.destroy();

$('#formCreate').data('bootstrapValidator', null);

$('#formCreate').bootstrapValidator();

update

更新

Another even better way to get this done is to use the enable/disable feature of bootstrapValidator:

另一种更好的方法是使用 bootstrapValidator 的启用/禁用功能:

bootstrapValidator
    .enableFieldValidators
     (
        'inputReason', 
        self.SelectedAbsenceType().ReasonRequired
     );

(thanks to @nghuuphuoc for pointing this out)

(感谢@nghuuphuoc 指出这一点)