<input
:type="passwordFieldType"
v-model="user.password"
id="password"
name="password"
class="input-section-three"
:class="{ 'is-invalid': submitted && $v.user.password.$error }"
placeholder="Enter new password"
:maxlength="maxpassword"
v-on:keypress="isPassword($event)"
/>
<input
:type="passwordFieldTypetwo"
v-model="user.confirmPassword"
id="confirmPassword"
name="confirmPassword"
class="input-section-three"
:class="{
'is-invalid': submitted && $v.user.confirmPassword.$error,
}"
placeholder="Confirm password"
:maxlength="maxconfirmpassword"
v-on:keypress="isconfirmPassword($event)"
/>I have two input fields like password and confirm password. where i am trying to disable confirm password field, untill user enter some content in password field. Can we do anything with v-bind:disabled=”newPassword.length === 0 ? true : false” to get resolved.
Answer
If you simply need to lock the second field until the user types anything in the first one, try using the disabled attribute on the second input:
<input
:disabled="!user.password"
...
>
This will set the disabled attribute as long as the value of user.password is falsy (eg. empty string).