Vee-validate: Ignore validattion when input is disabled

Created on 20 Jan 2017  Â·  6Comments  Â·  Source: logaretm/vee-validate

Versions:

  • VueJs: 2.1.8
  • Vee-Validate:

Description:

I need this feature that ignore validation when input is disabled

Steps To Reproduce:

✨ enhancement

Most helpful comment

I guess its a valid use case, I might add a prop to be passed to the directive, like a disabled prop which will enable/disable the validation on such inputs, for example:

<input type="text" :disabled="checked" v-validate="{ rules: 'required', disabled: checked }">

which is a little bit verbose but it won't have any backward compatibility issues. later on I might decide to either check the input disabled attribute or not, will require some studying though.

All 6 comments

I was looking for this as well. Is there any option to achieve this?

currently there is not, bringing such features or behaviors as a default could cause problems so I might have to study the implications of including such a behavior.

@logaretm Is there any way to "force" a validation even if the textboxes are blank?

Please find below a screenshot of what I currently have. And, what I need is basically "ignore" or "force" any fields under the Billing section to be valid - if the checkbox "My billing information is the same as my shipping information".

image

Everytime I check that box, I disable any of the fields under the Billing section - that's why I was thinking that having an option to ignore disabled inputs would be a good idea.

I guess its a valid use case, I might add a prop to be passed to the directive, like a disabled prop which will enable/disable the validation on such inputs, for example:

<input type="text" :disabled="checked" v-validate="{ rules: 'required', disabled: checked }">

which is a little bit verbose but it won't have any backward compatibility issues. later on I might decide to either check the input disabled attribute or not, will require some studying though.

That looks good to me. Since I would think that we should know which inputs
we want to have this behavior - we simply update the v-validate attribute.

Regards,

John Merced

*General Disclaimer: *The information contained in this electronic
communication is to be considered confidential and intended only for the
use of the recipient named above. The information is or may be legally
privileged and expresses the opinion of the writer only. If the reader of
this message is not the intended recipient, you are hereby notified that
any dissemination, distribution, or copying of this communication, or any
of its contents, is strictly prohibited. If you have received this
communication in error, please re-send this communication to the sender
listed above, delete the original message and any copy of it from your
computer system.

On Fri, Apr 7, 2017 at 12:02 AM, Abdelrahman Awad notifications@github.com
wrote:

I guess its a valid use case, I might add a prop to be passed to the
directive, like a disabled prop which will enable/disable the validation on
such inputs, for example:

which is a little bit verbose but it won't have any backward compatibility
issues. later on I might decide to either check the input disabled
attribute or not, will require some studying though.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/logaretm/vee-validate/issues/245#issuecomment-292426910,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAMRZlzx7o_Aav2ZBfSrWsBmbn6Kz4O5ks5rtbVRgaJpZM4LpABE
.

I'm using vue's vanilla el-form validations. I wrote a customer validator function and passed a flag enabled by :rules="[{enabled:enabledFlag,validator:myValidator}] in el-form-item. And

{
  data(){
    return{
      myValidator(rule,value,cb){
        if(!rule.enabled){
          cb();//pass the validation if enabled == false
          return;
        }
        //other your validations
      }
    }
  }
}

That worked perfectly. Hope this can help you.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jagasan picture jagasan  Â·  3Comments

the94air picture the94air  Â·  3Comments

Etheryte picture Etheryte  Â·  3Comments

Youdaman picture Youdaman  Â·  3Comments

yyyuuu777 picture yyyuuu777  Â·  3Comments