CODEWITHSUNDEEP
javascriptcssvue.jsvee-validate
czmafi00
czmafi00

Reputation: 31

Multiple css classes in VeeValidate classNames

Is it possible to set multiple classes in VeeValidate (option classNames)?

I am using VeeValidate for Vue.js for form validation. There are options: 'classes: true, classNames: valid and invalid css class.'

I would like to use bootstrap 'alert alert-warning'. However, when I add class names below, I get following error message:

Uncaught (in promise) DOMException: Failed to execute 'remove' on 'DOMTokenList': The token provided ('alert alert-warning') contains HTML space characters, which are not valid in tokens.

Is there workaround for this scenario besides creating a new css class?

Code:

Vue.use(VeeValidate, {
classes: true,
classNames: {
    valid: '',
    invalid: 'alert alert-warning'
}});

Upvotes: 1

Views: 529

Answers (1)

Styx
Styx

Reputation: 10076

According to source code it's possible to pass array of classes. Try this:

Vue.use(VeeValidate, {
  classes: true,
  classNames: {
    valid: '',
    invalid: ['alert', 'alert-warning']
  }
});

Upvotes: 2

Related Questions