How to validate decimal value in vee validate 3.0 version

Total
1
Shares

I want to validate latitude and logitude value and my code is

    <ValidationProvider :name=waypointLang.form.latitude rules="required|decimal">
        <div slot-scope="{ errors }">
            <input v-model="waypoint.latitude" readonly name="latitude" type="text" autofocus :placeholder="waypointLang.form.latitude" class="form-control" id="latitude"/>
                   <span class="required-field">{{ errors[0]}}</span>
        </div>
    </ValidationProvider>

I got error No such validator ‘decimal’ exists.

Thanks in advance


Solution

You can add a custom rule by adding this to your ./plugins/vee-validate.js file:

_x000D_

_x000D_

extend("decimal", {_x000D_
  validate: (value, { decimals = '*', separator = '.' } = {}) => {_x000D_
    if (value === null || value === undefined || value === '') {_x000D_
      return {_x000D_
        valid: false_x000D_
      };_x000D_
    }_x000D_
    if (Number(decimals) === 0) {_x000D_
      return {_x000D_
        valid: /^-?d*$/.test(value),_x000D_
      };_x000D_
    }_x000D_
    const regexPart = decimals === '*' ? '+' : `{1,${decimals}}`;_x000D_
    const regex = new RegExp(`^[-+]?\d*(\${separator}\d${regexPart})?([eE]{1}[-]?\d+)?$`);_x000D_
_x000D_
    return {_x000D_
      valid: regex.test(value),_x000D_
    };_x000D_
  },_x000D_
  message: 'The {_field_} field must contain only decimal values'_x000D_
})

_x000D_

_x000D_

_x000D_

Leave a Reply

Your email address will not be published. Required fields are marked *