Integration with vee validate

[aayaresko]

'cause both vee-validate and table component from the package are using same instance prop ('fields'), the latest constantly falling down during execution. to eliminate this problem I renamed 'fields' prop to 'tableFields'. also 'items' renamed to 'tableItems' for integrity.

[pi0]

Opps! thanks @aayaresko :)

We may start deprecating fields prop instead of forcing all users changing their use immediately! (Having both props and using a computed to check which is available. see here)

Also why items is renamed !? If this is just meant be be consistent with above prop rename, it would be better to replace fields with something like props or headers or ...

[aayaresko]

hm... I think you're right. in fact these changes was made hastily... sorry about that.
"Also why items is renamed !? If this is just meant be be consistent with above prop rename" that is correct.

[aayaresko]

I'll create an issue and describe the error I've encountered in that issue. I hope we'll find out the way we can fix that issue :)

[arivera12]

This should fix this issue
const config = {
errorBagName: 'errors', // change if property conflicts.
fieldsBagName: 'inputs ', //Default is fields
delay: 0,
locale: 'en',
dictionary: null,
strict: true,
enableAutoClasses: false,
classNames: {
touched: 'touched', // the control has been blurred
untouched: 'untouched', // the control hasn't been blurred
valid: 'valid', // model is valid
invalid: 'invalid', // model is invalid
pristine: 'pristine', // control has not been interacted with
dirty: 'dirty' // control has been interacted with
},
events: 'input|blur',
inject: true
};

Vue.use(VeeValidate, config);

[tmorehouse]

An alternative name for fields might be columns.

[pi0]

PR is conflicting with master. Also there are some big changes in validation system of BS4 rcs. Will certainly fix and provide some docs for that before 1.0 :) Also @arivera12 approach will be temporary fix for vue-validatee integration for now. Thanks for PR :)

[ndabAP]

Is there any progress with integrating vee-validate?

[alexsasharegan]

There is a bit of churn with Bootstrap 4's form validation styling, so we're stuck waiting out their next wave of changes for beta2. Hopefully it can stabilize so we can stabilize our form API. At that point, we can look at incorporating validation libs like vee validate.

[ndabAP]

@alexsasharegan, thanks a lot for the clarification.

[ottz0]

Vue Bootstrap says form validation methods are coming soon? By this do you mean you are looking to integrate boostrap-vue with vee-validate or implement your own actual validation library?

[tmorehouse]

The coming soon refers to added documentation regarding the new Boostrap V4.beta native browser validation (i.e. HTML5 validation attributes such as required, min, max, pattern input type), as well as how to trigger the validation states in general when not using browser built in validation.

Note that the new Bootstrap V4.beta valuation contextual states are lacking compared to previous version of bootstrap.

There are two types of validation that Boostrap V4.beta supports:

• Client Side (meaning browser native validation)
• Server side (meaning set by the server or client side JavaScript)

See https://getbootstrap.com/docs/4.0/components/forms/#validation for details.

We intend to base the documentation on Bootstraps Validation section, with adjustments to reflect usage with Bootstrap-Vue

[m1neral]

Now bootstrap-vue(with v4.beta) does not work with vee-validate?

[tmorehouse]

It can be used, but there are some conflicts with prop names that you need to override. See way above.

[m1neral]

@tmorehouse If you're about fieldsBagName(set custom value) - then the problem is not this.
I updated bootstrap-vue to beta, and vee-validate doesn't work: no any errors and no classes is-danger and etc.

[tmorehouse]

twbs/bootstrap#23454

[tmorehouse]

Bootstrap V4.beta uses completely different classes for validation compared to the alpha version. Bootstrap V4,.beta has serious issue with the new validation states/methodology, and (requires careful placement of the invalid-feedback container.... which doesn't work in many situations - i.e. input-groups, etc). Also the invalid-feedback still shows when the form-input is considered valid... Extremely buggy at the moment