Onzeur/SAE_2.02
Onzeur/SAE_2.02
1
2
Fork 0
mirror of https://grond.iut-fbleau.fr/stiti/SAE_2.02 synced 2024-11-09 21:11:40 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Correction des étoiles des commentaires

Browse Source
This commit is contained in:
stiti 2024-05-25 02:51:25 +02:00
parent f6e0b034e4
commit 30d94e8d2b
2 changed files with 53 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
CodeIgniter-3.1.13/application/views/accueil.php
View File

@ -59,8 +59,9 @@
<form action="<?php echo site_url('utilisateur/ajouter_avis'); ?>" method="post">
<textarea name="commentaire" rows="3" placeholder="Écrivez votre commentaire ici..." required></textarea>
<!-- Ajout des étoiles pour la notation -->
<h3>Note :</h3>
<div class="rating">
<input type="radio" id="star1" name="rating" value="1"><label for="star1">&#9733;</label>
<input type="radio" id="star1" name="rating" value="1" checked><label for="star1">&#9733;</label>
<input type="radio" id="star2" name="rating" value="2"><label for="star2">&#9733;</label>
<input type="radio" id="star3" name="rating" value="3"><label for="star3">&#9733;</label>
<input type="radio" id="star4" name="rating" value="4"><label for="star4">&#9733;</label>
@ -96,33 +97,5 @@
</div>
</div>
</body>
<script>
// Sélectionnez tous les boutons radio d'étoiles
const stars = document.querySelectorAll('.rating input[type="radio"]');
// Sélectionnez le champ caché pour la notation
const notationInput = document.getElementById('notation');
// Parcourez tous les boutons radio d'étoiles
stars.forEach(star => {
// Ajoutez un écouteur d'événement pour le clic sur chaque étoile
star.addEventListener('click', function() {
// Obtenez le numéro de l'étoile sélectionnée
const selectedStar = parseInt(this.value);
// Mettez à jour la valeur du champ caché "notation" avec la valeur de l'étoile sélectionnée
notationInput.value = selectedStar;
// Parcourez toutes les étoiles
stars.forEach(star => {
// Si l'étoile est inférieure ou égale à l'étoile sélectionnée, colorez-la en jaune, sinon, laissez-la grise
if (parseInt(star.value) <= selectedStar) {
star.nextElementSibling.style.color = '#FFD700'; // Colorez l'étoile en jaune
} else {
star.nextElementSibling.style.color = '#ccc'; // Laissez l'étoile grise
}
});
});
});
</script>
<script src="<?php echo base_url('assets/js/script_accueil'); ?>"></script>
</html>

49
CodeIgniter-3.1.13/assets/js/script_accueil.js Normal file
View File

@ -0,0 +1,49 @@
document.addEventListener("DOMContentLoaded", function() {
// Sélectionnez tous les boutons radio d'étoiles
const stars = document.querySelectorAll('.rating input[type="radio"]');
// Sélectionnez le champ caché pour la notation
const notationInput = document.getElementById('notation');
// Vérifiez si une étoile est déjà sélectionnée par défaut
const defaultStar = document.querySelector('.rating input[type="radio"]:checked');
if (defaultStar) {
// Obtenez le numéro de l'étoile sélectionnée
const selectedStar = parseInt(defaultStar.value);
// Parcourez toutes les étoiles
stars.forEach(star => {
// Si l'étoile est inférieure ou égale à l'étoile sélectionnée, colorez-la en jaune, sinon, laissez-la grise
if (parseInt(star.value) <= selectedStar) {
star.nextElementSibling.style.color = '#FFD700'; // Colorez l'étoile en jaune
} else {
star.nextElementSibling.style.color = '#ccc'; // Laissez l'étoile grise
}
});
// Mettez à jour la valeur du champ caché "notation" avec la valeur de l'étoile sélectionnée
notationInput.value = selectedStar;
}
// Parcourez tous les boutons radio d'étoiles
stars.forEach(star => {
// Ajoutez un écouteur d'événement pour le clic sur chaque étoile
star.addEventListener('click', function() {
// Obtenez le numéro de l'étoile sélectionnée
const selectedStar = parseInt(this.value);
// Mettez à jour la valeur du champ caché "notation" avec la valeur de l'étoile sélectionnée
notationInput.value = selectedStar;
// Parcourez toutes les étoiles
stars.forEach(star => {
// Si l'étoile est inférieure ou égale à l'étoile sélectionnée, colorez-la en jaune, sinon, laissez-la grise
if (parseInt(star.value) <= selectedStar) {
star.nextElementSibling.style.color = '#FFD700'; // Colorez l'étoile en jaune
} else {
star.nextElementSibling.style.color = '#ccc'; // Laissez l'étoile grise
}
});
});
});
});