finish Bootstrap for Form

Source/BusinessClass/CheckBoxQuestion.php

@@ -25,18 +25,18 @@ class CheckBoxQuestion extends BoxQuestion
         $possibleResponses = $this->getPossibleResponses();
         $categories = $this->getCategories();
 
-        $html = "\t\t\t<div id='$id' class='question'>
+        $html = "<div class='tab'>
-                <label><strong>$content</strong></label>\n";
+                    <h6>$content</h6>";
 
         for ($i = 0; $i < count($possibleResponses); $i++) {
             $categoriesSplit = $id."||".$possibleResponses[$i]."||";
             foreach ($categories[$i] as $category) {
                 $categoriesSplit.= $category."_";
             }
-            $html.= "\t\t\t\t<br><li><input type='checkbox' name='answers[]' value='$categoriesSplit' />
+            $html.= "<p><input style='-webkit-appearance: checkbox;' type='checkbox' name='answers[]' value='$categoriesSplit' />
-                <label>$possibleResponses[$i]</label>\n";
+                <label>$possibleResponses[$i]</label></p>";
         }
-        $html.= "\t\t\t</div><br>\n";
+        $html.= "\t\t\t</div>\n";
 
         return $html;
     }

Source/BusinessClass/ListBoxQuestion.php

@@ -25,19 +25,21 @@ class ListBoxQuestion extends BoxQuestion
         $possibleResponses = $this->getPossibleResponses();
         $categories = $this->getCategories();
 
-        $html = "\t\t\t<div id='$id' class='question'>
+
-                <label><strong>$content</strong></label>
+
-                <br><select name='answers[]'>\n";
+        $html = "<div class='tab'>
+                    <h6>$content</h6>
+                    <select name='answers[]'>";
 
         for ($i = 0; $i < count($possibleResponses); $i++) {
             $categoriesSplit = $id."||".$possibleResponses[$i]."||";
             foreach ($categories[$i] as $category) {
                 $categoriesSplit.= $category."_";
             }
-            $html.= "\t\t\t\t\t<option value='$categoriesSplit'>$possibleResponses[$i]</option>\n";
+            $html.= "<p> <option value='$categoriesSplit'>$possibleResponses[$i]</option> </p>";
         }
         $html.= "\t\t\t\t</select>
-            </div><br>\n";
+            </div>\n";
 
         return $html;
     }

Source/BusinessClass/TextQuestion.php

@@ -20,7 +20,7 @@ class TextQuestion extends Question
         return "<div class='tab'>
                     <h6>$content</h6>
                     <p>
-                        <input placeholder='...' oninput='this.className = ''''  type='text' name='answers[]'>
+                        <input data-id='$id' placeholder='...' oninput='this.className = ''''  type='text' name='answers[]'>
                     </p>
                 </div>\n";
     }

Source/Model/ModelCandidate.php

@@ -30,7 +30,6 @@ class ModelCandidate
         $answer = [];
         $category = [];
         $questionsId = [];
-        var_dump($answersAndCategories);
         foreach ($answersAndCategories as $answerAndCategory) {
             $exploded = explode("||",$answerAndCategory);
             if( count($exploded) == 3 ){
@@ -76,9 +75,6 @@ class ModelCandidate
         $nbQuestions = count($questions);
         $time = round(($nbQuestions * 20)/60);
 
-
-
-
         $html = "<div class='container mt-5'>
     <div class='row d-flex justify-content-center align-items-center'>
         <div class='col-md-8'>
@@ -97,7 +93,10 @@ class ModelCandidate
 
         if (count($questions) > 0) {
             $html.= "<div class='thanks-message text-center' id='text-message'> <img src='https://i.imgur.com/O18mJ1K.png' width='100' class='mb-4'>
-                    <h3>Merci d'avoir répondu !</h3> <span>Nous vous rencontacterons si votre profil nous intéresse !</span>
+                    <h3>Souhaitez-vous envoyer vos réponses ?</span>
+                    <input type='hidden' name='data_ids' value=''>
+                    <input type='submit' value='Envoyer' id='button'>\n
+                    <input type='hidden' name='action' value='submitForm'>
                 </div>
                 <div style='overflow:auto;' id='nextprevious'>
                     <div style='float:right;'>

Source/Views/HTML/form.php

@@ -6,9 +6,11 @@
     ?>
     <meta charset="UTF-8">
     <link rel="stylesheet" href="Views/CSS/styles.css" />
+    <link rel="stylesheet" href="Views/CSS/stylesForm.css" />
     <link rel="preconnect" href="<?php echo $googleApis; ?>">
     <link rel="preconnect" href="<?php echo $googleStatic; ?>" crossorigin>
     <link href="<?php echo $poppins; ?>" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
     <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" />
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
     <title>Formulaire de témoignage</title>
@@ -17,16 +19,27 @@
 </head>
 
 <body>
-
+    <header class="py-1">
-    <img id="logoUCA" src="<?php echo $logoUCA; ?>" height="35px" width="auto" alt="logo UCA">
+        <div class="container px-4 px-lg-5 my-5">
+            <div class="text-center text-white">
+                <h1 class="display-4 fw-bolder">Les Témoignages</h1>
+                <p class="lead fw-normal text-white-50 mb-0">IUT Informatique de Clermont-Ferrand</p>
+            </div>
+        </div>
+    </header>
 
     <?php echo $html; ?>
 
-</body>
+    <br><br>
+    <footer class="py-5 bg-white">
+    </footer>
 
-<script src="Views/JS/getData-Ids.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
-<script src="Views/JS/scripts.js"></script>
+    <script src="Views/JS/scripts.js"></script>
+    <script src="Views/JS/getData-Ids.js"></script>
+
+</body>
 
 </html>