Vee-validate: confirmed allways has error When using vee-validate manually

[umi-soft]

Versions:

• VueJs: 2.4.2
• Vee-Validate: 2.0.0-rc.23

Description:

When using vee-validate manually,confirmed allways has error.
https://jsfiddle.net/07de4pLL/

Steps To Reproduce:

[linchpinstudios]

I'm running into this as well. It actually isn't confirming the field but rather a string.

If you literally type in the confirmed field name (in this case password it will pass validation. So it's not validating against the password field but rather the string password.

[logaretm]

Well, manual validation has a lot of limitations. When validating a field value against another there must be a context where both are available. that is what the directive mostly does, define field dependencies which provides the needed context.

Confirmed only validates a value against another, the other value is passed as a first parameter to the rule. so you cannot do that manually. Maybe it is a poor design choice but again the directive does most of the work for you.

You could create a custom rule, since you have access to the component instance then.

[linchpinstudios]

I'm actually getting this issue when trying to run this.$validator.validateAll() is that related? I've even tried injecting the parent validator into the children and it still us validating a string password instead of the field password

[umi-soft]

thanks for your help.
by the way,I also test other rules which needs to compare with other fields，it will also have this problem。such as rule named 'before'.
and now I am trying to create a custom rule。

[Dahje]

@logaretm is the confirmed validator actually an issue right now, I am having issues when using it even when it is not manual. I have reverted back a couple version through of project to when I know it was working and I believe this broke somewhere between rc.6 and rc.13 as it does not function properly when my project is on rc.13,rc.17,rc.23, or rc.25, but it does on rc.6. Can you give any information on this?

Edit: A little bit more checking and I narrowed it down to rc.7 being the last time it worked correctly (At least for me).

[logaretm]

@Dahje The confirmed validator works fine, but its behavior has been changed in a breaking way. For example it longer searches the entire DOM for the target field, just the parent component template. Also it can target refs by prefixing the target name with $ so you should use that to target components that act as inputs.

In the next release there is a new rule called: is which does what confirmed does mostly, but does not target fields, meaning you would have to pass the value to it as first parameter, combined with the object form, you can get a much easier confirmation setup working:

<template>
  <div>
      <input type="text" name="password" v-model="pass" v-validate="{ required: true, is: confirmedPass }">
      <input type="text" name="confirmed" v-validate="{ required: true }" v-model="confirmedPass ">
  </div>
</template>

<script>
export default {
  data: () => ({
    pass: null,
    confirmedPass: null
  })
};
</script>

[Dahje]

I believe that makes sense then as I am using a customized vue component for my input fields. I will try using just normal input fields instead of the custom ones. Thanks for the help.

Edit: This definitely fixed it. @logaretm how long before the new realease? Will it be within the next 2 weeks?

[danjac]

Can confirm buggy behavior (^2.0.0-rc.25) re confirmed, but only in unit tests: this.$validator.validateAll() returns true in browser, but in spec tests it consistently return false, even though the errors bag is empty. When I remove the password confirmed validator the validateAll returns true. This is probably due to the way the component is mounted in tests, however the confirmation validation itself passes OK.

[logaretm]

@Dahje Probably at the end of this week, a lot of changes are coming up in the next release.

[JavaTheNutt]

The confirmed rule was also failing for me during unit tests. Switched from v-validate="'required|confirmed:$password'" to v-validate="{required: true, is: submissionDetails.password}" and tests passed seamlessly.

[logaretm]

The confirmed rule requires a bunch of setup and is very susceptible to errors, you can use is instead since it is only concerned with matching two values together.

[nickforddesign]

lol glad I found this thread, I was pretty confused why confirmed was passing for "password" only

[setsunashou14]

Below methods works for me:

<input v-validate="{ required : true, confirmed: 'password'}" type="password" name="confirm_password" class="form-control" placeholder="Confirm Password" v-model="field.confirm_password" data-vv-as="confirm password">

OR

<input v-validate="{ required : true, confirmed: field.password}" type="password" name="confirm_password" class="form-control" placeholder="Confirm Password" v-model="field.confirm_password" data-vv-as="confirm password">

[logaretm]

The target based rules always were buggy unfortunately, but I think I have
reached a stable standard for them, as of beta 2.1 releases you can no
longer target Fields with their names, only their refs.

I will link proper examples on Friday when I get back and further
explanation.

On Tue, 19 Jun 2018, 00:59 setsunashou14, [e-mail] wrote:

Below methods works for me:

—
You are receiving this because you modified the open/close state.

Reply to this email directly, view it on GitHub
https://github.com/baianat/vee-validate/issues/1015#issuecomment-398221514,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AF-KSsphTLpNI9nHeaNDvgIpCN2PptcHks5t-DDqgaJpZM4QtBq_
.