added tableau flotte and other stuff in flotte.js

equipe.js

@@ -55,34 +55,3 @@ document.getElementById("trier").addEventListener("click", function () {
   });
   afficherEquipe(triee);
 });
-
-const flotte1 = [
-  { modele: "Renault Kangoo", immatriculation: "AB-123-CD", km: 45200 },
-  { modele: "Peugeot Partner", immatriculation: "EF-456-GH", km: 78900 },
-  { modele: "Citroën Berlingo", immatriculation: "IJ-789-KL", km: 12300 },
-];
-
-function createLign(car) {
-  const tr = document.createElement("tr");
-
-  const tdmodele = document.createElement("td");
-  tdmodele.textContent = car.modele;
-
-  const tdimma = document.createElement("td");
-  tdimma.textContent = car.immatriculation;
-
-  const tdkm = document.createElement("td");
-  tdkm.textContent = car.km;
-
-  tr.append(tdmodele, tdimma, tdkm);
-  return tr;
-}
-const flotte = document.getElementById("flotte_tableau");
-
-function afficherFlotte(list) {
-  flotte.innerHTML = "";
-  for (const car of list) {
-    flotte.append(createLign(car));
-  }
-}
-afficherFlotte(flotte1);

flotte.js

@@ -1,7 +1,52 @@
 async function chargerFlotte() {
-  const reponse = await fetch("../vehicules.json"); // on demande le fichier
-  const vehicules = await reponse.json(); // on le transforme en tableau JS
-  console.log(vehicules); // pour vérifier
+  const message = document.getElementById("message_flotte");
+  const corps = document.getElementById("corps_flotte");
+
+  try {
+    const reponse = await fetch("../vehicules.json");
+    const vehicules = await reponse.json();
+
+    message.textContent = vehicules.length + " véhicules :";
+    for (const v of vehicules) {
+      const tr = document.createElement("tr");
+      tr.textContent = `${v.modele} — ${v.immatriculation} — ${v.km} km`;
+      corps.append(tr);
+    }
+  } catch (erreur) {
+    message.textContent = "Impossible de charger la flotte 😕";
+    console.error(erreur);
+  }
 }
 
 chargerFlotte();
+
+const flotte1 = [
+  { modele: "Renault Kangoo", immatriculation: "AB-123-CD", km: 45200 },
+  { modele: "Peugeot Partner", immatriculation: "EF-456-GH", km: 78900 },
+  { modele: "Citroën Berlingo", immatriculation: "IJ-789-KL", km: 12300 },
+];
+
+function createLign(car) {
+  const tr = document.createElement("tr");
+
+  const tdmodele = document.createElement("td");
+  tdmodele.textContent = car.modele;
+
+  const tdimma = document.createElement("td");
+  tdimma.textContent = car.immatriculation;
+
+  const tdkm = document.createElement("td");
+  tdkm.textContent = car.km;
+
+  tr.append(tdmodele, tdimma, tdkm);
+  return tr;
+}
+const flotte = document.getElementById("flotte_tableau");
+
+function afficherFlotte(list) {
+  flotte.innerHTML = "";
+  for (const car of list) {
+    flotte.append(createLign(car));
+  }
+}
+afficherFlotte(flotte1);

pages/contact.html

@@ -36,7 +36,7 @@
                     <input type="text" name="prenom" id="prenom" placeholder="Ex. : Matthieu" size="30" maxlength="20">
                 </p>
                 <p>
-                    <label for="e_mail">Votre e-mail:</label>
+                    <label for="email">Votre e-mail:</label>
                     <input type="email" name="email" id="email" placeholder="Ex. : stage2@echoes.solutions" size="50" maxlength="40">
                 </p>
                 <div>
@@ -45,8 +45,8 @@
                     <p class=small>Il vous reste <span id="restant">500</span> <span id="mot">caractères</span>.</p>
                 </div>
                 <p>
-                    <button>Envoyer</button>
-                    <button type="submit" id="effacer">Effacer</button>
+                    <button type="submit">Envoyer</button>
+                    <button type="button" id="effacer">Effacer</button>
                 </p>
 
             </form>
@@ -67,6 +67,8 @@
             </section>
         </div>
 
+        <h3>Notre flotte</h3>
+        <p id="message_flotte">Chargement…</p>
         <table border=1 class="table">
             <thead>
                 <tr>