Validate child input components on submit with Vee-Validate

Question

I\'m currently trying to create a Registration form with multiple \"Input Field\" components which all require validating once Submit has been pressed. They all currently va

Answer 1

I'm not sure I understand you correctly. But to make the call globally, you will have to emit an event on clicking the button and instruct each template to act upon that event. The action for each template should be to 'this.$validator.validateAll()', because 'this' will refer to that specific template.

You can do that by creating a named instance ('bus'). Create that before creating the instance.

var bus = new Vue({});

Use that to emit from the template:

bus.$emit('validate_all');

and to catch in a template:

created: function() {
   var vm = this;
   bus.$on('validate_all', function() {
      vm.$validator.validateAll()
   });
}

Now all fields should have been validated and all error messages should show. Good Luck!