Question

我正在使用这个插件formValidation我的问题是我只想触发必需的字段（年龄，名字，年份）如果我在selectbox中选择值3这将需要3个字段。如何做在formvalidation中？

      <form name="myform">


                     <div class='form-group'>
                         <label>Type</label>
                         <div>
                             <select class='form-control' name='type' id='type'>
                                   <option value ='1'> 1 </option>
                                   <option value ='2'> 2 </option>
                                   <option value ='3'> 3</option>
                                   <option value ='4'> 4 </option>
                             </select>
                         </div>
                     </div>



                     <div class="form-group">
                         <label for="age">age</label>
                         <input type="text" class="form-control" id="age" name="age">
                     </div>

                     <div class="form-group">
                         <label for="name">name</label>
                         <input type="text" class="form-control" id="name" name="name">
                     </div>

                     <div class="form-group">
                         <label for="year">age</label>
                         <input type="text" class="form-control" id="year" name="year">
                     </div>

        </form>

这是我的js

             $('#myform').formValidation({
              framework: 'bootstrap',
              icon: {
                  valid: 'glyphicon glyphicon-ok',
                  invalid: 'glyphicon glyphicon-remove',
                  validating: 'glyphicon glyphicon-refresh'
              },
              fields: {

                  year: {
                      validators: {
                          notEmpty: {
                              message: 'The year is required'
                          }
                      }
                  },
                  name: {
                      validators: {
                          notEmpty: {
                              message: 'The name is required'
                          }
                      }
                  },
                  age: {
                      validators: {
                          notEmpty: {
                              message: 'The age is required'
                          }
                      }
                  }



              }
          });

提前谢谢。

Answer 1

您可以使用 enableFieldValidators 方法启用＆amp;禁用字段的验证器。

首先，您必须使用设置为 enabled 的 false 选项禁用字段的所有验证程序，然后选择选择框的值为3，启用它们。

请参阅以下代码：

$(document).ready(function () {
    $('#myform').formValidation({
        framework: 'bootstrap',
        icon: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            year: {
                // Disable the validators of the field 'year'
                enabled: false, // <==
                validators: {
                    notEmpty: {
                        message: 'The year is required'
                    }
                }
            },
            name: {
                // Disable the validators of the field 'name'
                enabled: false, // <==
                validators: {
                    notEmpty: {
                        message: 'The name is required'
                    }
                }
            },
            age: {
                // Disable the validators of the field 'age'
                enabled: false, // <==
                validators: {
                    notEmpty: {
                        message: 'The age is required'
                    }
                }
            }
        }
    });
});

$('#type').on('change', function (e) {
    if (parseInt($('#type').val(), 10) === 3) {
        // Enable the validators of your fields
        // 'age', 'name' & 'year'
        $('#myform').data('formValidation').enableFieldValidators('age', true);
        $('#myform').data('formValidation').enableFieldValidators('name', true);
        $('#myform').data('formValidation').enableFieldValidators('year', true);
    } else {
        // Disable them again
        $('#myform').data('formValidation').enableFieldValidators('age', false);
        $('#myform').data('formValidation').enableFieldValidators('name', false);
        $('#myform').data('formValidation').enableFieldValidators('year', false);
    }
});

工作示例：

http://jsfiddle.net/Arkni/ncbybr1b/

参考文献：

enabled 选项的文档：http://formvalidation.io/settings/#field-enabled
enableFieldValidators 方法的文档：http://formvalidation.io/api/#enable-field-validators

使用selectbox进行jquery formvalidation

1 个答案:

工作示例：

参考文献：