Versions
Describe the bug
When using an input tag with type number and v-validate rules of required and integer or also numeric, entering values into the field and then removing the values results in the errors of that field to state must be numeric and may contain decimal points..
This error message seems misleading as the validations prevent decimal value input so with no content, the user should probably see a message that this field is required.
To reproduce
Steps to reproduce the behavior:
must be numeric and may contain decimal points.Expected behavior
Would expect that the removal of content from the input field of number with rules of required and integer or numeric would cause the validation error presented to be that the field is required.
This only happens if the input type is number.
Testing this with vee-validate 2.0.0 does result in the error message to be that the field is required.
Demo link
https://jsfiddle.net/268hxvef/
Wondering if this is an actual bug in the semantics, bug in the rule being used when no content (decimal instead of required) when input type is number or it's intended by design.
This is caused by vee-validate trying to validate the field based on their HTML attributes, for number fields the decimal rule is automatically added.
You can turn that behavior off like this:
Vue.use(VeeValidate, {
useConstraintAttrs: false
});
The problem is that decimal and integer are conflicting rules by definition, so it is advised not to use both at the same time. So Turning the behavior off is the easiest solution for you.
Ahh, okay. Thanks!
Shouldn't this be in the documentation! Was stuck on this issue for days together!
The step attribute should be taken into account for if VeeValidate automatically chooses decimal or integer for type="number" fields. If step is a whole number, the decimal rule should not be used
Most helpful comment
This is caused by vee-validate trying to validate the field based on their HTML attributes, for number fields the
decimalrule is automatically added.You can turn that behavior off like this:
The problem is that
decimalandintegerare conflicting rules by definition, so it is advised not to use both at the same time. So Turning the behavior off is the easiest solution for you.