[Vuejs]-How can I validate a column that is disabled in vue

by

0👍

✅

You can make a computed value by checking if the radios has the desired value

Html

:v-validate="validation"

Computed part

validation () {
        return {
            required: this.radios == 'institution'
        };
    }

0👍

It seems like you’re using vuetify, which already integrate validation functionality.

you can use the props "rules" and provide your validations like this

<v-text-field
  v-model="customer.Company"
  outlined
  dense
  label="Unvan"
  name="Company"
  :rules="[v => !!v || 'Field required']"
  :disabled="radios == 'personal' "
  hide-details="auto" />

The rules props take an array of functions, boolean or string
it needs to return either true / false or a message
I suggest you to make your rules in a constant to be able to reuse it.
You can now put the condition to not validate when your text-field is disabled

 const rules = [v => !!v || (!v && radios == 'personal') || 'Field required']

For more information, visit https://vuetifyjs.com/en/api/v-text-field/#props
to look at the props informations and samples.

Leave a comment