web-dev-qa-db-fra.com

Comment construire un système de révision simple et d'évaluation à 5 étoiles?

Je suis très novice dans les technologies Web et il s’agit essentiellement d’un projet à terme sur lequel mon équipe travaille. Nous travaillons sur un site d'examen des aliments.

Pour le moment, je ne sais pas trop comment mettre en place un système simple d'évaluation à 5 étoiles. Suis-je censé utiliser un langage côté serveur tel que PHP ou un langage client tel que Javascript (w/JQuery). En regardant autour, il semble que JQuery est plus approprié pour cela? Ou serait-ce une combinaison des deux?

Ce que je recherche en ce qui concerne la fonctionnalité, c'est:

  • Les étoiles s'allument lorsque la souris survole
  • La page ne doit pas être rechargée lorsque Une étoile est cliquée (pas vraiment nécessaire)
  • Une sorte de moyenne montrée à côté des étoiles
  • Le classement doit être stocké quelque part dans une base de données MySQL (est-ce une bonne idée?)

Je m'excuse vraiment si la question a l'air vague et stupide, je n'ai pas la moindre idée de la façon de mettre en œuvre ceci et j'ai essayé de googler. Si vous avez des questions à ce sujet, veuillez me le faire savoir.

Merci beaucoup.

21
Chris Vinz

Les étoiles s'allument lorsque la souris survole
Il existe un excellent tutoriel sur le Web pour la conception d'un système d'évaluation à 5 étoiles: http://rog.ie/blog/css-star-rater . C'est purement CSS donc pas besoin de Javascript.

Il n'est pas nécessaire de recharger la page quand on clique sur une étoile (ce n'est pas vraiment nécessaire)
Ajax est votre ami. Ce que j’ai fait est d’avoir une <a class="one_star" href="javascript: submitRating(1, 5)"><a> représente une étoile et la fonction submitRating() utilise Ajax pour transmettre ma note (1/5) au serveur, le serveur enregistre la note (et assigne l’utilisateur qui a donné le rating) et recalcule la nouvelle notation moyenne et renvoie les résultats au format JSON.

Une sorte de moyenne affichée à côté des étoiles
Facile. Ecrivez un script SQL qui, basé sur l'id du produit, prend le sum de la note moyenne (c.-à-d. 1/5 + 2/5 + 4/5, etc.), puis divisez-le (somme) par le montant total de évaluations et le multiplie par 100. Renvoyez la valeur au serveur et du serveur au client. 

Rating doit être stocké quelque part dans une base de données MySQL (Est-ce une bonne idée?)
J'utilise MySQL pour cela et cela fonctionne comme un charme .... Tous les systèmes de base de données vont bien.

20
Buhake Sindi

Les étoiles s'allument lorsque la souris survole
Simple, avoir une image pour une étoile jaune et une image pour une étoile blanche. Quand une étoile est survolée, toutes les étoiles à gauche ont leur "src" s changé en étoile jaune, toutes les étoiles à droite ont leur srcs changé en étoile blanche. 

La page n'est pas rechargée lorsque l'on clique sur l'étoile
Regardez dans Ajax/XHR
http://en.wikipedia.org/wiki/Ajax_(programming)
Astuce: créez un fichier .php appelé vote.php, et indiquez-y l'ID de votre aliment et le classement attribué par l'utilisateur.

Une sorte de moyenne affichée entre les étoiles
La plupart des sites Web n'indiquent que des étoiles de 0%, 50% et 100% ... les utilisateurs ne paniqueront pas vraiment s'ils n'obtiennent pas une "précision exacte" 

Rating devrait être stocké dans la base de données MySQL
Tout système de base de données est bon. Mais oui, vous voudrez probablement utiliser une base de données SQL pour cette

3
Warty

Voici une réponse à une question similaire et devrait être un bon début.

Transformez un nombre en nombre d'étoiles à l'aide de jQuery et CSS

2
Justin Johnson

Pour avoir un contrôle Nice star-clicky, oui, vous avez besoin de javascript. Donc, vous devriez faire jQuery.

Oui, vous aurez envie de stocker des choses dans une base de données. Vous pouvez utiliser PHP et MySQL pour cela.

Étant donné qu’il s’agit d’une tâche de classe, c’est beaucoup à mettre en œuvre. Envisagez de tricher en utilisant un CMS existant. Drupal en particulier a des fonctionnalités similaires à celles que vous demandez. Vous n'aurez pas à apprendre beaucoup de Drupal, achetez simplement le livre "Using Drupal". Le chapitre 4 vous montrera comment:

... construit un site Web de critiques de produits pour la communauté, avec ... et des modules Fivestar fournissant un widget d'évaluation.

Drupal est basé sur PHP et utilise MySQL comme base de données, il semble donc correspondre à votre destination. Cela peut prendre un peu de temps avant que Drupal ne s'exécute ... mais vous pourrez alors accéder rapidement au chapitre 4.

Si le professeur insiste pour que vous écriviez du code, Drupal est une source ouverte et il est facile d’ajouter des modules personnalisés.

0
Frank Schwieterman

Oui, votre approche semble parfaite. il y a quelques pièces:

étoiles avec effet de survol:

jquery: http://www.fyneworks.com/jquery/star-rating/

prototype: http://www.fyneworks.com/jquery/star-rating/

css: http://www.henryhoffman.com/css-star-rating-tutorial.html

onclick peut appeler un appel ajax avec jquery: http://api.jquery.com/jQuery.post/

puis sur le côté serveur, il peut être maintenu dans une table de classement

theres un exemple plus long ici:

http://webtint.net/tutorials/5-star-rating-system-in-php-mysql-and-jquery/

0
user262976

Une combinaison de JS et PHP est la voie à suivre (si PHP est votre langue côté serveur choisie). JQuery est un bon moyen de mettre en place facilement une sorte de système de vedettes. Je l’ai développé une fois pour un de mes sites que j’ai supprimé par la suite. C’était une chose simple qui comportait des événements liés à 5 images. Lorsque vous cliquez dessus, s'il s'agit de "id 4", il l'enverra comme vote de l'utilisateur utilisant la fonction .post () de jQuery à un script PHP qui note l'utilisateur et enregistre le vote dans une base de données MySQL si ils n'avaient pas déjà voté.

0
Xorlev