Quasar: Form Input Validation

[rstoenescu]

Is there any good vue validation out there or should Quasar have its own?

[smolinari]

Not sure how good or bad it is, but there is this. https://github.com/vuejs/vue-validator

Scott

[musicformellons]

Not worked with it but this one is currently at top of my list:
http://vee-validate.logaretm.com/

[XristMisyris]

+1 for vee-validate

[rstoenescu]

I like vee-validate too. Did anyone used it with Quasar?

[smolinari]

Yes, vee-validate looks pretty good.

Scott

[rstoenescu]

Will make some improvements to all form inputs soon. Thinking of doing a Quasar owned validation if I have enough free time.

[murbanowicz]

@rstoenescu what is progress on that?
If you are going to develop own validation for Quasar, please remember to include ASYNC validation, as it is really important for e.g. uniqueness .

[rstoenescu]

Vee-validate seems the best option. Use that. Works with Vue 2 too.
Current plan is to add only a few CSS classes like for error.
Not sure it's worth it to duplicate work done by packages like vee-validate at this point.

[rstoenescu]

Go with vee-validate and use the new "has-error" CSS class for form components. This will land in next Quasar version after v0.8.2.

[murbanowicz]

@rstoenescu CSS has-error is not present in 0.8.3

[rstoenescu]

Yes, forgot to correct the statement. It will be available in v0.9.

[murbanowicz]

As I understand it will be applied to INPUT ?

Can you create a way to include error message below the input or you want to leave it to developers?

From: Razvan Stoenescu [mailto:[email protected]]
Sent: Saturday, November 5, 2016 8:13 PM
To: quasarframework/quasar [email protected]
Cc: Marek [email protected]; Comment [email protected]
Subject: Re: [quasarframework/quasar] Form Input Validation (#96)

Yes, forgot to correct the statement. It will be available in v0.9.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub https://github.com/quasarframework/quasar/issues/96#issuecomment-258637660 , or mute the thread https://github.com/notifications/unsubscribe-auth/AI80kitgRXdrFWJew5qOEUdUtMstHVEpks5q7ONFgaJpZM4KD-C- . https://github.com/notifications/beacon/AI80kixU_08bl_l92EvdwU1JRkg0ZNkzks5q7ONFgaJpZM4KD-C-.gif

---

This email has been checked for viruses by Avast antivirus software.
https://www.avast.com/antivirus

[rstoenescu]

There are so many ways to handle the error message.. there's no "generic" way to go. So I'll leave it to the developers.

[murbanowicz]

Just for future reference.

If you want to include errors under the input,

Apply something like:

.with-errors {
    height: 77px;
}

To not get so bad looking changing height of form to insert error message between fields.

[smolinari]

For those of you interested, I also found this library.

https://github.com/monterail/vuelidate

Scott