omezení výběru sedadel

index.html

@@ -39,7 +39,7 @@
             <option value="B">Business</option>
         </select>
         <label for="pocet-cestujicich">Počet cestujích</label>
-        <input id="pocet-cestujicich" value="1" type="number" min="1" max="9" step="1">
+        <input name="pocetCestujici" id="pocet-cestujicich" value="1" type="number" min="1" max="9" step="1">
 
         <div class="letadlo">
             <div>B1</div>
@@ -54,14 +54,23 @@
     </form>
 
     <script>
-        let sedadla = document.querySelectorAll(".letadlo > div");
-
-        let volbaTridy = document.querySelector("#volba-tridy");
-        volbaTridy.addEventListener("change", function() {
+        function resetSedadel() {
             for (let index = 0; index < sedadla.length; index++) {
                 const element = sedadla[index];
                 element.classList.remove("sedadlo-vyber");
             }
+        }
+
+        let sedadla = document.querySelectorAll(".letadlo > div");
+
+        let volbaTridy = document.querySelector("#volba-tridy");
+        volbaTridy.addEventListener("change", function() {
+            resetSedadel();
+        });
+
+        let pocetCestujicich = document.querySelector("#pocet-cestujicich");
+        pocetCestujicich.addEventListener("change", function() {
+            resetSedadel();
         });
 
         for (let index = 0; index < sedadla.length; index++) {
@@ -69,7 +78,20 @@
             seat.addEventListener("click", function() {
                 let formdata = new FormData(document.querySelector("form"));
                 if (this.innerText.indexOf(formdata.get("trida")) == 0) {
-                    this.classList.toggle("sedadlo-vyber");
+                    let pocet = document.querySelectorAll(".sedadlo-vyber").length;
+                    if (this.classList.contains("sedadlo-vyber")) {
+                        this.classList.remove("sedadlo-vyber");
+                    }
+                    else {
+                        if (pocet < formdata.get("pocetCestujici")) {
+                            this.classList.add("sedadlo-vyber");
+                        }
+                        else {
+                            alert("Počet sedadel zavisí na počtu cestujících.");
+                        }
+                    }
+                    
+                    // this.classList.toggle("sedadlo-vyber");
                 }
                 
             });