vuelidate - How to display custom validation message with built-in validators

user_19577379 0
Viewed 297

I am using vuelidate library for validating my forms. I have to use the built-in validators with the custom message. I have tried below. But not working. Ref: Vuelidate Form validation library

validations() {
   return {
     email: {
       requiredIf: requiredIf(() => {
         return this.data.enablevalidation;
       }),
       email: helpers.withMessage(this.data.validation_err_message, email),
     },
   };
},

my problem is, If the validation is false, still its validating the email also. Validation should be pass based on the both condition. If validation false, Email validation also should not work. How to achieve this scenario

vuelidate vue.js javascript
1 Answers

We have to use the helpers with functional method to achieve this.

validations () {
   return {
     email: {
       requiredIf: helpers.withMessage(this.data.validation_err_message, 
          requiredIf(() => {
            return this.data.enablevalidation
       })),
       email: helpers.withMessage(this.data.validation_err_message, email),
     }
   }
},

Initiallty it will validate, whether this field have to validate or not. If validation is true, It will display the given message. Email will be validate if given wrong.

user_73339530
Related