Conserver étoile notation membre

Eléphant du PHP | 282 Messages

17 avr. 2017, 19:42

Bonjour,

J'ai un système de notation par étoile de 10 et je voudrais conserver la note de l'utilisateur sous forme d'étoiles mais je n'y arrive pas.

Voilà où j'en suis :
	
<style>
		.rating {
			font-size: 35px;
			overflow:hidden;
			line-height:normal;
		}
		.rating a {
			float:left;
			font-size: 24px;
			color: #aaa;
			text-decoration: none;
			-webkit-transition: color .4s;
			-moz-transition: color .4s;
			-o-transition: color .4s;
			transition: color .4s;
		}
		.rating a:hover,
		.rating a:hover ~ a,
		.rating a:focus,
		.rating a:focus ~ a		{
			color: #f7d16d;
			cursor: pointer;
		}
		.rating2 {
			direction: ltr;
		}
		.rating2 a {
			float:none;
		}
</style>
<div class="rating rating2">
				<?php
				$getNewsQuery = $bdd->query("SELECT * FROM `note_film` WHERE posteur=$posteur AND id_film=$id_film");
$getTestQuery = $bdd->query("SELECT note AS 'nombre' FROM `note_film` WHERE posteur=$posteur AND id_film=$id_film");
$getTest = $getTestQuery->fetch();
$vote = $getTest['nombre'];
if( $getNewsQuery->fetch() !== false )
{
// Etoiles jaunes
$etoilejaune = '<a hrefid="" style="color:#f7d16d;" alt="">?</a>';
$i = 0;
while ($i != $vote) {
echo $etoilejaune;
$i++;}
 
// Etoiles grises
$etoilegrise = '<a hrefid="" alt="">?</a>';
$i = 0;
while ($i != (10 - $vote)) {
echo $etoilegrise;
$i++;}
 }
 ?></div>
Le soucis avec ce code c'est pour la réécriture par dessus, ça ne fonctionne pas correctement. En gros ça affiche bien le nombre d'étoile jaune correspondant à la note du membre mais quand je veux réécrire par dessus ça part de la droite comme ceci :

Image

Quelqu'un aurait il une idée ?

Eléphant du PHP | 340 Messages

24 avr. 2017, 20:04

Salut,

Si j'ai bien compris tu veux que les étoiles grise soit toutes à droite.
Tu utilises de l'ajax? qu'est ce que tu veux dire par réecrire?

Eléphant du PHP | 282 Messages

27 avr. 2017, 16:07

Salut !

En gros comme sur allociné. Quand on note ça conserve le nombre d'étoiles qu'on a donné. Et on peut modifier à tout moment.
J'arrive à faire tout ça en ajax mais je ne parviens pas du tout à conserver la note du membre.
AJAX :
<?php
	// Est-ce que le ID est présent? et est-ce que que l'utilisateur est connecté?
	if (isset($_SESSION['id'])) {
		if (isset($_GET['id'])){
			$posteur = $_SESSION['id'];
			$id_film = $_GET['id'];
			$star = $_GET['star'];
			$date = date('Y-m-d');
			$getEnvieMembre = $bdd->query("SELECT * FROM `note_film` WHERE posteur=$posteur AND id_film=$id_film");

			// Ici on vérifie le nombre d'entrée que la requête nous retourne
			// Quand on constate que le résultat est égal à zéro, on ajoute l'entrée
			if( $getEnvieMembre->rowCount() === 0) {
				$addwatchliste = $bdd->prepare("INSERT INTO `note_film` VALUES ('', ?, ?, ?)");
				$addwatchliste->execute(array($posteur, $id_film, $star));	
				
				// Tout s'est bien passé, on envoie la confirmation	
				$retour = array(
					'resultat' => true,
					'message' => 'Votre note a bien été prise en compte',
				);		
			}
			else {
				$addnote = $bdd->prepare("UPDATE `note_film` SET `note` = ? WHERE posteur=$posteur AND id_film=$id_film");
				$addnote->execute(array($star));
				
				// Tout s'est bien passé, on envoie la confirmation	
				$retour = array(
					'resultat' => true,
					'message' => 'Votre note a bien été prise en compte',
				);		
			}
		}
		else {
			$retour = array(
				'resultat' => false,
				'message' => 'Une erreur s\'est produite. Le ID n\'est pas présent dans la requète',
			);
		}
	}
	else {
		$retour = array(
			'resultat' => false,
			'message' => 'Vous devez être connecté pour noter ce film.',
		);
	}

// Le retour est la confirmation/non-confirmation faite par le code
// On retourne le tout en JSON pour nous permettre de l'utiliser dans le Javascript

echo json_encode($retour);
Et l'affichage :
<style>
		.rating {
			font-size: 35px;
			overflow:hidden;
			line-height:normal;
		}
		.rating a {
			float:left;
			font-size: 24px;
			color: #aaa;
			text-decoration: none;
			-webkit-transition: color .4s;
			-moz-transition: color .4s;
			-o-transition: color .4s;
			transition: color .4s;
		}
		.rating a:hover,
		.rating a:hover ~ a,
		.rating a:focus,
		.rating a:focus ~ a		{
			color: #f7d16d;
			cursor: pointer;
		}
		.rating2 {
			direction: rtl;
		}
		.rating2 a {
			float:none;
		}
</style>
<div>
				Donner ma note : 
				<div class="rating rating2"><!--
		--><a hrefid="<?=$getNews['id']; ?>"  alt="10" title="Donner 10/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="9" title="Donner 9/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="8" title="Donner 8/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="7" title="Donner 7/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="6" title="Donner 6/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="5" title="Donner 5/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="4" title="Donner 4/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="3" title="Donner 3/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="2" title="Donner 2/10">★</a><!--
		--><a hrefid="<?=$getNews['id']; ?>" alt="1" title="Donner 1/10">★</a>
			</div>
			</div>

Eléphant du PHP | 340 Messages

28 avr. 2017, 10:41

Peux tu nous mettre ton code javascript .

Eléphant du PHP | 282 Messages

28 avr. 2017, 15:43

Ah oui pardon j'ai oublié ! Le voici :

Code : Tout sélectionner

$(document).on("click" , ".rating", function(event){ event.stopPropagation(); //on bloc sur l'élément clické event.preventDefault(); //on enlève l'action par défaut var element = event.target||event.srcElement; //on récupère l'élement dans le DOM var f = $(element); //puis on le définit dans jQuery if (f.is('a')) { //est ce que c'est un lien <a> ? $.ajax ({ url : "./modules/module-notation-ajax.php", data : {id : f.attr('hrefid'), star : f.attr('alt')}, dataType: 'json', type : "get", success : function (data) { if (data.resultat == true) { // Le film a été noté alert(data.message); } else { // Il y a eu un probleme... alert(data.message); } } }); } });
Merci ! ;)

Eléphant du PHP | 340 Messages

29 avr. 2017, 22:51

" je ne parviens pas du tout à conserver la note du membre." en base de données? autre chose ta variable $posteur correspond à l'id du posteur?

Eléphant du PHP | 282 Messages

30 avr. 2017, 13:57

Non j'arrive à conserver dans la base de données mais c'est dans l'affichage que je n'y arrive pas. En gros je voudrais afficher le nombre d'étoiles que le membre a donné quand il a voté !

Eléphant du PHP | 340 Messages

02 mai 2017, 10:39

tu dois récupérer le nom du posteur en sql puis tu le retourne dans ton json, ensuite dans ta fonction success javascript tu récupères le nom renvoyé en json. pas besoin de renvoyer ta note elle est déjà disponible avec ta variable f.
Après utilise la fonction append de jquery pour insérer ton élément posteur et note .