1

I have found the same question in this platform. Based on the accepted answer, I have built a form and made my button disabled.

<v-btn :disabled="!isFormValid">submit</v-btn>

data: () => ({
  isFormValid: false,
})

But, Whenever, I filled an input, the submit button would activated though all other inputs are empty!

enter image description here

So, what is the actual way to keep the button disabled until all the inputs are not empty?

Codepen Demo

user1896653
  • 3,247
  • 14
  • 49
  • 93

1 Answers1

3

You should remove the lazy-validation property. As per the documentation,

If lazy-validation is enabled, value(A boolean value representing the validity of the form.) will always be true unless there are visible validation errors

Abdul Niyas P M
  • 18,035
  • 2
  • 25
  • 46
  • That usually isn't a problem if in your submit button function you call `this.$refs.myFormRef.validate()`. – cmfc31 Jan 24 '22 at 16:45