仅当国家/地区为美国或加拿大时,才使用bootstrapValidator进行条件验证

时间:2014-04-02 04:13:39

标签: jquery validation twitter-bootstrap

我正在使用bootstrapValidator,我正试图找出一种方法,只有在选定的国家/地区是美国,加拿大或其他NANP国家时才验证电话格式,因为它只能检查这些国家/地区的格式。

在我的java脚本的“onReady”部分,我有:

billingPhone: {
        validators: {
                notEmpty: {
              message: 'Phone is required and can\'t be empty'
            },
            phone: {
              message: 'Format is invalid'
            }
        }
},

我有一个选择国家/地区和电话输入(以及其他字段)我有一个脚本,根据国家选择的值,也将值isNANP更改为true或false。但我无法弄清楚如何将if(isNANP)包裹在电话验证器周围。

我尝试将启用值(见下文)设置为false或true,但似乎没有任何效果。

billingPhone: {
        validators: {
                notEmpty: {
              message: 'Phone is required and can\'t be empty'
            },
            phone: {
              message: 'Format is invalid',
              enabled: isNNAP ? true : false
            }
        }
},

1 个答案:

答案 0 :(得分:2)

您可以根据需要创建验证规则。这是一个示例实现:

(function($) {
    $.fn.bootstrapValidator.validators.customPhone = {
        html5Attributes: {
            message: 'message',
            field: 'field',
            check_only_for: 'check_only_for'
        },

        /**
         * Return true if the input value contains a valid US phone number only
         *
         * @param {BootstrapValidator} validator Validate plugin instance
         * @param {jQuery} $field Field element
         * @param {Object} options Consist of key:
         * - message: The invalid message
         * - field: The name of field that will be used to get selected country
         * - check_only_for : Coma separated ISO 3166 country codes // i.e. 'us,ca'
         * @returns {Boolean}
         */
        validate: function(validator, $field, options) {
            var value = $field.val();
            if (value == '') {
                return true;
            }

            var countryField = validator.getFieldElements(options.field);

            if (countryField == null) {
                return true;
            }

            var countryCode = countryField.val().trim();

            if(countryCode == ''){
                return true;
            }

            var check_list = options.check_only_for.toUpperCase().split(',')

            if(check_list.indexOf(countryCode.toUpperCase()) == -1) {
                return true;
            }

            value = value.replace(/\(|\)|\s+/g, '');
            return (/^(?:1\-?)?(\d{3})[\-\.]?(\d{3})[\-\.]?(\d{4})$/).test(value);
        }
    }
}(window.jQuery));

加载引导验证程序后使用此选项。然后,您可以分配验证规则,如:

billingPhone: {
    validators: {
        notEmpty: {
            message: 'Phone is required and can\'t be empty'
        },
        customPhone: {
            message: 'Format is invalid',
                check_only_for: 'us,ca',
                field: 'country'
        }
    }
},

其中字段是将用于获取所选国家/地区的字段的名称。并且 check_only_for 应列出您要检查验证角色的所有国家/地区代码。

享受!