vee-validate

Validation reset after form submission

由 泪湿孤枕 提交于 2019-12-24 03:47:11
问题 I've got the form with checkboxes and I want the user to select at least one of them. Everything works fine, but after resetting the form I can't hide the validation message. This case is described exactly in the docs, but the provided solution seems to be invalid because after submitting the form validation errors show up. <template> <v-app> <v-content> <playground></playground> <v-card class="mx-auto" outlined> <ValidationObserver ref="obs" v-slot="{ invalid, valid, validated, passes, reset

Using Vee-validate to disable button until form is filled out correctly

由 强颜欢笑 提交于 2019-12-21 09:24:55
问题 I want to disable my submit button until my form is filled out correctly, this is what I have so far: <form> <input type="text" class="form-control" v-validate="'required|email'" name="email" placeholder="Email" v-model="userCreate.userPrincipalName" /> <span v-show="errors.has('email')">{{ errors.first('email') }}</span> <button v-if="errors.any()" disabled="disabled" class="btn btn-primary" v-on:click="sendInvite();" data-dismiss="modal" type="submit">Send Invite</button> <button v-else=

Javascript functions are not working properly in the vuejs

由 我的梦境 提交于 2019-12-13 04:08:44
问题 Below is my code. I would like to validate the form during submit. I prevented submit action untill all data is valid. Hence I have used "validata all()" method. If the form has null/invalid date, it should alert "not submitted".Else it should alert "submitted". My problem is that, when I clicked the submit button at first time, the alert displays as "submitted" instead of "not submitted" Result1. But when I clicked the same button for the second time or further it displays correctly as "not

Hide/delay password confirmation error in Vee validate

由 倖福魔咒の 提交于 2019-12-13 02:42:33
问题 When I use Vee-validate library in Vuejs, when I focus on password field, it show the error not match with password confirm. My code: <input v-validate="'required|min:6|confirmed'" type="password" class="form-control" id="password" name="password" placeholder="New Password" v-model="password"></input> <span class="is-danger" v-if="errors.has('password')">{{errors.first('password')}}</span> <input v-validate="'required'" type="password" class="form-control" id="password_confirmation" name=

Vee validation is not working inside the <b-form-input> tag

由 北战南征 提交于 2019-12-11 21:36:19
问题 Below is my code. In the addEmployee.vue file, fields are there. Firstname , Middlename , Lastname. Among the three fields "Firtname & Lastname" has noraml tag. But "Middlename" has tag. Vee-validate "required" validation is working for the normal input tag fields but it's not working for Middlename field. What is the reason for this? addEmployee.vue <template> <b-card> <h4 slot="header" class="card-title">Employee</h4> <b-row> <b-col sm="3"> <b-form-group> <label for="name">First Name <

Vue-i18n Integration by vee-validate not working as described in the documentation

由 断了今生、忘了曾经 提交于 2019-12-11 19:45:11
问题 Hello I did a copy/paste from the vee-validate documentation into this codesandbox and I get no validation message - just the following error on the console: [vue-i18n] Cannot translate the value of keypath 'validations.messages._default'. Use the value of keypath as default. Is it a bug within vue-validate , vue-i18n, vuejs ? Or should one configurate it somehow different? 回答1: you forgot to initialize i18n After const i18n = new VueI18n(); add this line i18n.locale = "en"; this line tells

VeeValidate(vue.js) image file size and dimensions validation

由 ∥☆過路亽．° 提交于 2019-12-09 22:41:54
问题 How to set validation in form like this using vee validate in vue.js Image dimension less then 500*500 pixel Image size less then 100kb 回答1: For two of those requirements, there are available ("native") rules: Must be an image, use image rule. Image size less then 100kb, use size:100 rule. Now, for the Image dimension less than 500*500 pixels ...the problem is with the less . The dimensions rule test for exact size. So you'll need to tweak it to test for size smaller than or equal to the size

How to localize error messages in vuejs using vee-validation

由 帅比萌擦擦* 提交于 2019-12-08 07:44:49
问题 I want to localize some of the messages and attributes name using vee-validation. I'm able to localize the messages only when using E.g: this.$validator.localize('en', { messages: { required: (field) => '* ' + field + required'}, attributes: { email: 'Email' }}); inside the "created()" function. But I would like to give this in the "main.js". Whenever I'm calling this in the main.js it's throwing error like: "Uncaught TypeError: Cannot read property 'localize' of undefined" My code in main.js

How to localize error messages in vuejs using vee-validation

由 早过忘川 提交于 2019-12-08 03:46:26
I want to localize some of the messages and attributes name using vee-validation. I'm able to localize the messages only when using E.g: this.$validator.localize('en', { messages: { required: (field) => '* ' + field + required'}, attributes: { email: 'Email' }}); inside the "created()" function. But I would like to give this in the "main.js". Whenever I'm calling this in the main.js it's throwing error like: "Uncaught TypeError: Cannot read property 'localize' of undefined" My code in main.js. I have given this code in main.js because I would like to access through out my project in all vue

Vue js vee validate password confirmation always false

由 江枫思渺然 提交于 2019-12-03 16:32:35
问题 I'm trying to use vee validate to verify the password using this code. <div> <input type="password" placeholder="Password" v-model="password" v-validate="'required|min:6|max:35|confirmed'" name="password" /> </div> <div> <span>{{ errors.first('password') }}</span> </div> <div> <input type="password" placeholder="Confirm password" v-model="confirmPassword" v-validate="'required|target:password'" name="confirm_password" /> </div> <div> <span>{{ errors.first('confirm_password') }}</span> </div>
订阅 vee-validate