diff --git a/include/js/charts.js b/include/js/charts.js index 64d4d9f052be6102df2e8cd54beed7eca8fe123a..5db45da7b00efcd69a4370dcb9dda744225f3280 100644 --- a/include/js/charts.js +++ b/include/js/charts.js @@ -1,6 +1,9 @@ -// Requête pour obtenir les données du serveur -const httpRequest = new XMLHttpRequest() -httpRequest.onreadystatechange = () => { +/** + * Requête AJAX pour obtenir une information du serveur et l'utiliser pour faire deux graphiques. + * Il faut déclarer la requête et lui dire de faire les graphiques dès qu'on reçoit le résultat. + */ +const httpRequest = new XMLHttpRequest() // 1. Déclaration de la requête +httpRequest.onreadystatechange = () => { // 2. Définition de ce qu'il faut faire quand on obtient une réponse if (httpRequest.readyState === XMLHttpRequest.DONE) { if (httpRequest.status === 200) { // On a reçu la réponse du serveur, on peut générer la graphique @@ -14,11 +17,12 @@ httpRequest.onreadystatechange = () => { } } } -httpRequest.open('POST', 'include/php/data.php', true) +httpRequest.open('POST', 'include/php/data.php', true) // 3. Ouverture et configuration de la requête httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded') // Requête SQL const query = "SELECT acad_mies, sum(capa_fin) AS places FROM parcoursup GROUP BY acad_mies ORDER BY places DESC" -httpRequest.send(`query=${encodeURIComponent(query)}`) +httpRequest.send(`query=${encodeURIComponent(query)}`) // 4. Envoi de la requête + /** * Fonction qui fait deux graphiques avec les données du serveur diff --git a/index.php b/index.php index 391a10dbd72b41ce0385276f29a4effd4d144765..3177cc2fff2623642cd84429a35a12c848938a29 100644 --- a/index.php +++ b/index.php @@ -1,6 +1,6 @@ <?php /** - * Différents examples de requêtes SQL + * Différents exemples de requêtes SQL */ include 'include/php/functions.php'; ?> @@ -60,13 +60,13 @@ foreach ($result as $row) { <h2>Les BUT Informatique avec le plus grand nombre de candidates admises</h2> <ol> <?php -$sth = $dbh->prepare('SELECT lib_comp_voe_ins, acc_tot_f FROM parcoursup +$sth = $dbh->prepare('SELECT lib_comp_voe_ins, acc_tot_f, acc_tot FROM parcoursup WHERE lib_for_voe_ins LIKE "BUT - Informatique%" ORDER BY acc_tot_f DESC LIMIT 5'); $sth->execute(); $result = $sth->fetchAll(); foreach ($result as $row) { - echo '<li>' . $row['lib_comp_voe_ins'] . ' (<em>' . $row['acc_tot_f'] . ' femmes</em>)</li>'; + echo '<li>' . $row['lib_comp_voe_ins'] . ' (<em>' . $row['acc_tot_f'] . ' étudiantes sur ' . $row['acc_tot'] . '</em>)</li>'; } ?> </ol> diff --git a/search.php b/search.php index c589de0c87872030e7d73bed4545fa88f01c4183..50b582a0e491710acf92b3251a96b4b4ebb57aa9 100644 --- a/search.php +++ b/search.php @@ -2,9 +2,9 @@ /** * Barre de recherche de formations avec affichage d'informations * - * L'utilisateur choisir dans le formulaire une formation. + * L'utilisateur choisit une formation dans le formulaire. * Le formulaire envoie cette information vers la même page, et on - * affiche le nombre de places et le nombre de candidats. + * affiche le nombre de places et de candidats. */ include 'include/php/functions.php'; ?> @@ -24,9 +24,7 @@ include 'include/php/functions.php'; </label> <datalist id="formations"> <?php -/* On remplit l'élément datalist (les suggestions pour le formulaire) - * avec les noms des formations - */ +// On remplit l'élément datalist (les suggestions pour le formulaire) avec les noms des formations $dbh = db_connection(); $sth = $dbh->prepare('SELECT lib_comp_voe_ins FROM parcoursup ORDER BY lib_comp_voe_ins ASC'); @@ -41,10 +39,9 @@ foreach ($result as $row) { </form> <?php -/* Si $_GET['formation'] est défini, ça veut dire qu'on est arrivé dans cette page - * après avoir sélectionné une formation. Dans ce cas, on affiches les information - * de cette formation - */ +// Si $_GET['formation'] est défini, ça veut dire qu'on est arrivé dans cette page +// après avoir sélectionné une formation. Dans ce cas, on affiche les informations +// de cette formation if (isset($_GET['formation'])) { $sth = $dbh->prepare('SELECT capa_fin, voe_tot FROM parcoursup WHERE lib_comp_voe_ins = :formation'); @@ -54,7 +51,7 @@ if (isset($_GET['formation'])) { $sth->execute($donnees); $result = $sth->fetchAll(); if (count($result) == 1) { - // Si on obtient un résultat, afficher les informations + // Si on obtient un résultat, on affiche les informations echo "<h2>" . $_GET['formation'] . "</h2>"; echo "<p>" . $result[0]['voe_tot'] . " candidats pour " . $result[0]['capa_fin'] . " places</p>"; } diff --git a/test-charts.html b/test-charts.html index b1a745bb351f89b1a7785459faf0e907cab67ee6..1d940ff45caea7871b2876292453b04abd1dd7f4 100644 --- a/test-charts.html +++ b/test-charts.html @@ -3,16 +3,16 @@ <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> - <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous"> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous"> <title>SAÉ 303</title> </head> <body> <div class="container"> <div class="row"> - <div class="col-12 col-md-6"> + <div class="col-12 col-lg-6"> <div id="piechart_div"></div> </div> - <div class="col-12 col-md-6"> + <div class="col-12 col-lg-6"> <div id="barchart_div"></div> </div> </div> @@ -20,6 +20,6 @@ <script src="https://www.gstatic.com/charts/loader.js"></script> <script src="include/js/charts.js" defer></script> - <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script> + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> </body> </html> \ No newline at end of file