Bonjour,
je sais que ce genre de question a déjà été posé, mais je n'arrive vraiment pas à appliquer ce que j'ai trouvé sur le net.
Actuellement j'ai des checkbox (5), qui sont créés à partir d'un mock (oui, le but c'est de comprendre et manipuler).
Mon code donne ça actuellement :
import du mock et du model pour remplir les attributs des checkbox
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 <div v-for="item in getItems()" :key="item" > <input :id="item.id" slot="input" type="checkbox" :name="item.code" :value="item.libelle" :checked="checked" > <label slot="label" :for="item.id" > {{ item.libelle }} </label> </div> ... <div v-show="messageMini">{{ $t('LIMITE_MINI') }}</div > <div v-show="messageMax">{{ $t('LIMITE_MAX') }}</div >
J'arrive donc pas à trouver un moyen pour que la fonction compte le nombre de checkbox cochée.
Code : 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 export default class ModalFiltre extends Vue { @Prop() private checked!: boolean; private messageMini = false; private messageMax = false; //ici c'est le mock getItems(): FiltreData[]{ return [truc1, truc2, truc3, truc4, truc5]; } //ici la fonction qui doit compter les checkbox private checkItem() { let countItem = 0; for(let item in this.getItems){ if(this.checked){ countItem++; } } console.log('countItems = ' + countItem); //si case cochée < 1 => messageMini //si case cochée > 4 => messageMax }
Le but étant que s'il n'y en a pas => j'affiche le message : nombre insuffisant
s'il y en a trop j'affiche un message nombre max dépassé.
Si je pouvais avoir juste un coup de main, c'est tout en Typescript.
Merci d'avance
Partager