M.Sharma
M.Sharma

Reputation: 289

using multiple validation with regex in VeeValidate and VueJs

I am applying multiple validation using VeeValidate in a latest VueJs application but that is not working. This regex is to allow only alphabet,number,space and a few special characters. However, VeeValidate always returns false.

                                     <ValidationProvider name="Address"
                                            :rules="{
                                                     required: true,
                                                     max:25, 
                                                     regex:'/[a-zA-Z0-9\\s_@./#&:;+-]*$/'}"
                                            v-slot="validationContext">
                            <b-form-group id="lbl-city" label="*Address:">

                                <b-form-input id="txt-customer-address"
                                              v-model="formData.address"
                                              placeholder="Enter Address"
                                              :state="getValidationState(validationContext)"
                                              aria-describedby="input-3-feedback">
                                </b-form-input>
                                <b-form-invalid-feedback id="input-3-feedback">
                                    {{ validationContext.errors[0] }}
                                </b-form-invalid-feedback>
                            </b-form-group>
                        </ValidationProvider>

any suggestion?

Upvotes: 0

Views: 4283

Answers (2)

M.Sharma
M.Sharma

Reputation: 289

I found the problem.

[1] Regex was wrong and initially missing ^ symbol [2] \s in regex was allowing space so I added space at last in my regex

So the final regex is regex:/^([a-zA-Z0-9_@;: ])*$/,

Now, It only accept Alphabet,Number,Space and following characters @;;_

Upvotes: 2

Troy Kessler
Troy Kessler

Reputation: 387

You need to apply regex delimeters instead of a string. So in your case you can just remove the "'" from your regex like this

<ValidationProvider name="Address"
   :rules="{
      required: true,
      max:25, 
      regex:/[a-zA-Z0-9\\s_@./#&:;+-]*$/
   }"
   v-slot="validationContext"
>
    ...
</ValidationProvider>

Upvotes: 1

Related Questions