Vee-validate: Multiple scopes on one or more fields.

[jdfx]

Hi

I have a use case where I need to validate the same field in two different contexts and would like to be able to give a field two different scopes i.e. data-vv-scope="product_1|product"

Is this possible?

For example I have a row in a shopping cart for 'product 1' which is actually a group of 5 fields for a product in different sizes. There is an update button on this row, when you click it, it should validate all fields marked product_1 (5 fields, xxs, xs, m, l, xl, xxl etc..) without caring about the rest of the form.

At the bottom of the page, there is an 'update all' button. Pressing this should validate all fields marked 'product'.

Can I achieve what I would like using scopes?

Thank you

[jdfx]

Also seems as though when you add scopes, you lose the ability to validate the entire form? Apologies if I am doing something wrong.

Say I have parts of my form I wish to validate, I add seperate scopes, 'sizes' and 'references'.

this.$validator.validateAll("sizes").then((result) => {....

this.$validator.validateAll("references").then((result) => {....

etc all works fine.

However I would then expect calling :

this.$validator.validateAll().then((result) => {....

To validate the entire form, regardless of scopes? currently this excludes anything scoped from validation.

This would be ok if I could pass in multiple scopes to the validateAll method, i.e.

this.$validator.validateAll("sizes|references").then((result) => {....

But I don't think I can?

Again sorry if I am missing something obvious.

Thanks

[logaretm]

You are not missing anything, currently, there is no way to include a field into multiple scopes. And I don't see a common use case there.

But I do see some enhancements that can be done, like the ability to validate multiple scopes.

[jdfx]

Thanks for confirming. Awesome project btw.

I feel as though this would be a very useful additional functionality.

As it stands scopes are allowing me to use multiple forms in the same component which is great. However allowing for a field to be in multiple scopes allows for more complex scenarios - like mine where I need to validate parts of a form independently from another.

My forms fields are dynamically generated from a large data-set, so I can't target parts of the form based on any names or id's etc, a 'scope' sounds like the perfect tool for the job, but it's somewhat limited as shown above.

Having both this and the ability to validate multiple scopes would be amazing. I have coded around it for now but it feels very hacky and scopes look like the proper place for it.

I appreciate it may not be a very common scenario but it does sound like a good feature to me. I will attempt to fork and PR something but I imagine it's not very straightforward.

[jdfx]

Also just to note that in the docs it states:

"you can have inputs with the same name in different scopes".

http://vee-validate.logaretm.com/examples.html#scope-example

Perhaps I miss-read this and you're actually meaning two separate inputs with the same name but I'm not sure why someone would ever do that?

[logaretm]

Basically, it was meant to support inputs in different tabs or sub-routes, like a login/register page both forms would have 2 fields with a name of email instead of loginEmail and registerEmail.

I guess scopes are very handy to solve your issue, if we think of them as groups rather than scopes. Will try to implement something about that.

[wrabit]

+1 with assigning multiple scopes to fields.

Use case: A form that has mandatory fields for saving a record, but also a similar set of fields which are advised to be completed but not mandatory.

@jdfx curious to see if you managed any workaround?

[logaretm]

I was thinking about this recently after the introduction of __Validation Components__ and I don't see this implemented at all.

I'm strongly considering the removal of scopes all together, since their introduction they added a large complexity layer on the API, and more often than not ppl mess up scopes on their first few tries. This is still a consideration, and I have not planned to go with it.

Alternatively maybe allow you to target fields based on a regex pattern. For example, say you have two forms: signup and signin.

Naming your fields with a prefix would be more intuitive than having "scopes" on the forms that don't work most of the time:

<input name="signup_email" ...>

<input name="signin_email" ...>

// Validate signup fields
this.$validator.validate(/signin.*/);

// Validate both forms
this.$validator.validate(/sign.*/);

You can easily construct whatever kind of grouping based on your regex.

Same would go for error bag and related APIs.

[dmcbrn]

@logaretm

Hi, your suggested proposal for this scenario is great for my use, much better than scopes. However I have issues regarding the implementation.

<input name="aaa_1" ...>
<input name="aaa_2" ...>

// Validate both forms
this.$validator.validate(/aaa.*/);

returns TypeError: collection.indexOf is not a function

I assume it's just a simple syntax error but I can't figure it out.