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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
| window.addEventListener('load', ev => {
// le DOM est construit et la page web est visible
// début code du test
// 0- création de la table - 50 cases
let table = document.createElement('table');
let tbody = table.createTBody();
for (let row = 1; row <= 7; row++) {
let tr = tbody.insertRow();
for (let col = 1; col <= 6; col++) {
let key = row + ((col - 1) * 7);
let td = tr.insertCell();
let label = document.createElement('label');
let input = document.createElement('input');
input.type = 'checkbox';
input.name = 'cb[' + key + ']';
input.value = key; // on met la clé en valeur
label.append(key, input);
td.append(label);
}
}
document.getElementById('form90cases').prepend(table); // insert la table dans le formulaire
// 1- checkbox
let allBoxes = document.querySelectorAll('#form90cases input[type=checkbox]');
allBoxes.forEach(function (box) {
box.addEventListener('click', function () {
// box.parentNode.parentNode.classList.toggle('on');
box.closest('td').classList.toggle('on');
show_results();
});
});
// 2- Reset (Vider la grille)
let btnReset = document.querySelector('button[name="btn-reset"]');
btnReset.addEventListener('click', function () {
for (let box of allBoxes) {
box.checked = false; // décoche la sélection
box.removeAttribute('checked'); // décoche la sélection
// box.parentNode.parentNode.classList.remove('on');
box.closest('td').classList.remove('on');
}
show_results();
});
// 3- inverser la sélection
let btnInvert = document.querySelector('button[name="btn-invert"]');
btnInvert.addEventListener('click', function () {
for (let box of allBoxes) {
box.checked = !box.checked;
// box.parentNode.parentNode.classList.toggle('on');
box.closest('td').classList.toggle('on');
}
show_results();
});
// 4- Envoyer
let btnEnvoi = document.querySelector('button[name="btn-envoi"]');
btnEnvoi.addEventListener('click', function (ev) {
ev.stopPropagation();
ev.preventDefault();
console.log(`Soumission interrompue, voir les résultats : `);
let resultats = show_results();
document.querySelector('#Aff').textContent = `Il y a ${ resultats[0] } nombres : ${ resultats[1].join(', ')}.`;
}, {
capture: false,
passive: false,
once: false
});
function compareNombres(a, b) {
return a - b;
}
function show_results() {
let
show_results = document.getElementById('show-results'),
nbre_results = document.getElementById('nbre-results'),
ii = 0,
results = [];
for (const box of allBoxes) {
if (box.checked) {
results.push(Number(box.value));
ii++;
}
}
results.sort(compareNombres);
show_results.textContent = results.join(', ');
nbre_results.textContent = ii;
return [ii, results];
}
// fin code du test
}, {
capture: false,
passive: true,
once: false
}); |
Récupérer une valeur contenu dans un array
Répondre avec citation
Envoyé par giovanni
danielhagnoul a été plus vite que moi, ben cela fait de la lecture pour giovanni 
Partager