So I’m currently working on extracting a highly re-usable form into a subcomponent in VueJS (Vue2). This form is long in my actual application, and so instead of hardcoding it, I decided to procedurally generate it from a JSON file. Now, I was having a devil of a time getting it to work, and couldn̵…
Tag: vuelidate
Issues with importing Vuelidate Library
As a part of implementing Form Validation, I want to use Vuelidate library in a Sails.js page. The page gets the Vue code by using this webpage.page.js: , which is linked to this webpage.ejs View Template: This gives an error ‘Cannot use import statement outside a module’. I have the Vuelidate npm…
How do I access another field using vuelidate
I’m making some validators on a form for shipping using vuelidate. Currently I’m checcking if the postalCode is in the right format. This field is dependent on the country field though (because different countries have different postal code formats. I’m having trouble accessing the viewmodel…
Based on length how to check values in Vuejs? [closed]
Closed. This question needs details or clarity. It is not currently accepting answers. Want to improve this question? Add details and clarify the problem by editing this post. Closed 1 year ago. The community is reviewing whether to reopen this question as of 1 year ago. Improve this question With length i ne…
Go to next input field at maxLength?
I have a form in Vue that has some combined inputs for styling reasons for a phone number input. My problem is that the user has to hit tab in order to go to the next input field of the phone number. Is there a way to check for the max length of the current and input and when that
[Vue warn]: Property or method “$v” is not defined
I wanted to make a validation on the match of passwords with the following error: vue.runtime.esm.js?2b0e:619 [Vue warn]: Property or method “$v” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based com…
Is it possible to re-use a computed property by passing a parameter (Vuelidate)
I’m using Vuelidate for a form that has multiple sections. Each of these sections has formData object and name. Nested inside each of these is a ZIP object to validate zip code with numerous validations….required, numeric, minlength, and maxlength. What I would like to do is have ONE computed prop…
Vuelidate: setting $model does not update component
Given the following Vue component that uses Vuetify and Vuelidate: I would like to programmatically change the value of this.picker. I tried both changing the v-model as well as the Vuelidate $model: and Neither of them caused a change in the UI nor produced an error message. How can I programmatically update…
Vue bootstrap b-form-select sets vuelidate’s $anyDirty to true on load
The issue I’m having is due to the input event that’s being run when I first set a value to the v-model, this data is being loaded in via an API; I understand why the form is being set to dirty (as this it is being changed) but this causes problems in another component I have which checks if the
Vuelidate: validate on click, not when field touched
I’m kinda new to vuelidate, and everything works fine, except I have no clue how to run validation only when the button Submit has been clicked. Right now it marks touched field red when you start providing any input and I’d like it to wait with that, till user wants to submit filled form. Here…