lazy-rules="ondemand" doesnt work when I use external validation
I want q-form to trigger external validation function “isUsernamVlid” when I click Login button. However, every time I typed a character in q-input, validation function was triggered. How to fix it?
<q-form @submit.prevent="submitForm"> <q-input class="q-ma-md" outlined lazy-rules="ondemand" v-model="id" label="ID" error-message="wrong" :error="!isUsernameValid" /> <q-btn class="q-ma-md" type="submit" color="light-blue" label="Login" :loading="submitting" > <template v-slot:loading> <q-spinner-facebook /> </template> </q-btn>
dobbel last edited by
a bit of a workaround:
you could check inside the !
isUsernameValidif the login button has been pressed before( with a
data.hasFormSubmittedboolean in data for example), if not
!data.formSubmittedthen always return
isUsernameValid( no errors will be shown until you press the submit button).
In addition when you change the input value set
data.formSubmitted = falseagain.
@dobbel Thank you your advice. I think your approach looks good but the suggested way is not fundamental solution for usage of lazy-rules. It will check validation when I would type a character in input box. It means, anyway, lazy-rules=“ondemand” still not work.