Bonjour,

Je rencontre quelques difficult�s avec la validation personnalis� de formulaire
J'aimerais pouvoir utiliser la validation native des navigateurs en utilisant setCustomValidity(...) (actuellement j'utilise un watch et dans le callback je fais this.$refs....setCustomValidity(...) suivant si le champ est valid� ou non

Bien-sur il m'est impossible de couvrir mes besoins avec les attributs standard tel que pattern/maxlength/ect...

Le probl�me c'est que j'ai aussi des rendus conditionnels (avec v-if) donc les �l�ments son re-rendus et avec je perds le custom validity...

Voici un exemple un peu bateau

Code html : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
</template>
	<b-form-input
		ref="ref"
		type="text"
		v-model.trim="value"
		required
		v-if="show">
	</b-form-input>
</template>
 
[...]
 
<script>
        export default {
                data() {
                        return {
                                value: "",
                                show: true,
                        }
                },
                watch: {
                        value: function (val) {
                                if(val === "toto") {
                                        this.$refs.ref.setCustomValidity("Erreur, toto n'est pas valide")
                                }
                                else {
                                        this.$refs.ref.setCustomValidity("")
                                }
                        },
 
                        show: function (val) {
                                if(val === "toto") {
                                        this.$refs.ref.setCustomValidity("Erreur, toto n'est pas valide")
                                }
                                else {
                                        this.$refs.ref.setCustomValidity("")
                                }
                        },
                },
        }
</script>
mais quand show change (passe � false, puis repasse � true) le watch se d�clenche bien mais l'�l�ment n'est pas encore rendu, et donc je me retrouve forcement avec Uncaught TypeError: Cannot read property 'setCustomValidity' of undefined
Donc voil� y'a t'il un moyen de v-bind le custom validity � l'attribue directement ? Avec la variable qui sera bind� sera dans le computed.

ps: dans mon exemple le watch est redondant, et peu �tre que l'exemple n'est pas fonctionnel mais malheureusement je n'aurai la possibilit� de tester mon exemple que demain.