Dans ce tuto AJAX en vidéo, vous apprendrez à réaliser un système de vote à la manière du site Youtube.
Nous créerons d'abord une base de données afin de stocker du contenu, notamment des liens vers des vidéos (pour l'exemple), ainsi que les votes des visiteurs.
Nous verrons comment afficher la vidéo demandée par l'utilisateur et nous créerons un système de vote façon Youtube "j'aime" ou "j'aime pas".
Nous afficherons ensuite les résultats au dessous de la vidéo avec deux barres de pourcentage de votes, pour cela nous ferons un calcul de maths très savant (niveau CM2) et nous afficherons également le nombre total de votes "pour" et "contre".
Nous ferons bien sur fonctionner l'application d'abord en PHP, avec rechargement de la page, et nous verrons ensuite comment permettre à l'application de fonctionner en AJAX avec Jquery, et comment récupérer des variables du PHP au Javascript grâce au format JSON. L'avantage de l'AJAX est que l'utilisateur pourra continuer de regarder la vidéo tout en votant sans qu'il y ait de coupure de la vidéo. Nous implémenterons également quelques petits effets Jquery sympathiques pour le confort de l'utilisateur.
Bon tuto!
Jetez un oeil à ces autres tuto Php, jQuery, Ajax
Réaliser un panier d'achat…
Dans ce tuto PHP, en vidéo, vous allez apprendre à réaliser…
Afficher la différence entre…
Dans ce tuto PHP en vidéo, vous apprendrez à afficher la différence…
Création d'un formulaire…
Dans ce tuto jQuery nous allons apprendre à nous servir de…
PHP: envoyer des emails avec…
Dans ce tuto PHP en vidéo, nous verrons comment se servir de…
Espace membre en PHP/MySQL
Dans ce tuto PHP/MySQL en vidéo, nous verrons comment implémenter…
PHP POO cas pratique pour…
Dans ce tuto PHP en vidéo pour débutants en POO, nous verrons…
Upload et galerie d'images…
Dans ce tuto PHP en vidéo, vous apprendrez à réaliser un…
Transmission de données Flash…
Dans ce tuto Flash PHP, vous allez apprendre à transmettre…
Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto Php, jQuery, Ajax de 47 minutes est proposée dans une résolution plus grande que l’extrait suivant :
simpledev
, formateur certifié
Témoignage des clients de simpledev
![]()
Très bon formateur et surtout une incroyable diversité de tuto dans le domaine du développement de site web. J'ai commencé par les tutos concernant le html 5 et CSS3. Ces derniers proposent des sujets très utiles pour dynamiser mon site
![]()
Excellents tutos, très bien expliqués. Les tutos de Simpledev sont très utiles. L'une des choses qui fait la richesses des tutos est le "mélange des langages de programmation". On peut ainsi réaliser des systèmes complexes, avec plusieurs langages !
![]()
Bref j'ai pas besoin de préciser très bon formateur :)
![]()
Excellent Formateur, 5/5 tout y-est: application, contenu, bon son, pédagogie, bonne image, j'ai beaucoup appris en 2 jours de tuto. Parmi les quelques tutoriels que j'ai vu c'est celui qui se démarque. Simpledev. Bravo à lui j'en redemande.
![]()
Quoi dire d'autre ? merci pour tout ;).
Lire les autres témoignages
D'autres tuto de simpledev
Système de commentaire en AJAX avec PHP et Jquery
Dans ce tuto AJAX en vidéo, nous verrons comment réaliser un système de commentaire…
Vérifier la disponibilité d'un pseudo en AJAX
Dans ce tuto AJAX en vidéo, nous verrons comment vérifier la disponibilité d'un pseudo…
Formulaire de contact AJAX avec PHP et Jquery
Dans ce tuto AJAX en vidéo, nous réaliserons un formulaire de contact. Dans un premier…
Effacer des données grâce à AJAX et Jquery
Dans ce tuto Codeigniter en vidéo, nous verrons comment effacer des données issues…
Notes attribuées par les utilisateurs (1 vote)
Les avis / Questions des utilisateurs (11)
Donnez votre avis ou posez une question au formateur.
Vous souhaitez commenter ce tuto vidéo ? Créez un compte gratuit. Déjà membre ? Identifiez-vous
Ce tuto en résumé ...
Ce tuto Php, jQuery, Ajax d’une durée de 47 minutes a été acheté 88 fois et a reçu une note moyenne de 5/5.
Ce tuto a été publié le 1 décembre 2010 par simpledev, formateur certifié par Tuto.com, ayant reçu une note moyenne de 4,4/5 pour l’ensemble de ses vidéos.
Tous les fichiers sources sont fournis avec cette formation. Ces derniers vous permettront de reproduire les manipulations expliquées dans cette formation.
Ce tuto video vous expliquera étape par étape, toutes les manipulations présentées par le formateur.
Toutes nos vidéos sont visionnées par notre équipe, avant d’être mises en ligne, garantissant ainsi la qualité des produits téléchargés.













(n'a pas acheté ce tuto - 06 octobre 2011)
" @simpledev
ok thanks =)
En fait c'est pour intégrer ça sur un template WordPress que je fais, je pense que ca devrait le faire mais peut-être que jte dirais si j'ai un petit soucis :P
M'enfin c'est pas pour toute de suite, pas trop le temps pour les projets perso en ce moment ^^ "
(auteur de ce tuto - 05 octobre 2011)
" @exootia
Si jamais y'a un souci pour faire ce que tu souhaites, tu peux toujours me contacter, c'est vraiment pas ce qu'il y'a de plus compliqué à mettre en oeuvre:) "
(n'a pas acheté ce tuto - 05 octobre 2011)
" @simpledev :
ok merci ! Ca devrait fonctionner pour ce que je veux alors :) "
(auteur de ce tuto - 05 octobre 2011)
" @exootia
Bonjour,
En fait on peut faire sur une seul page un vote pour le nombre d'élément que l'on veut.
Je montre dans ce tutoriel comment voter pour un élément en fonction de son id récupérer en base de donnée. De là il est possible de récupérer l'id d'un deuxième élément afin de voter pour celui-ci, et si jamais vous voulez interdire le vote pour le second élément si l'utilisateur a déjà voté pour le premier, il suffit de faire une simple vérification en base de données.
Voilà, j'espère avoir répondu à votre question:) "
(n'a pas acheté ce tuto - 05 octobre 2011)
" Hello!
En fait j'ai besoin de faire un systeme de vote, du coup j'aurais une petite question afin de savoir si ce tuto correspond à ce dont j'ai besoin.
J'aurais sur une page deux éléments, et l'utilisateur vote pour l'un ou l'autre. C'est possible avec ce tuto ou il limite le vote a un élément par page ? (comme sur youtube...) "
(auteur de ce tuto - 27 mars 2011)
" @osirisliberal
Salut,
Ben si tu veux autoriser le vote uniquement si le membre n'a pas encore voté, il suffit de vérifier si le membre en question a déjà voté ou non.
Pour cela tu rajoutes un champ membre_id dans ta table de vote qui prendra la valeur de l'id du membre qui a voté. Ensuite tu fais les vérifications avant d'afficher ton système de vote et si le membre n'a pas encore voté, tu l'affiches, sinon tu l'affiche pas.
Voilà a+ "
(a acheté ce tuto - 25 mars 2011)
" Bonjour :) Clarté et fluidité au top :)
Je pense me jeter sur celui avec l'effet de reflet CSS3 des la semaine prochaine !
J'aimerai solliciter votre bienveillance pour vous demander comment il est possible de disposer d'un système de vote unique en suivant la même trame, avec un affichage sur l'index uniquement si la video en question n'a pas été voté, sachant que le système de vote est intégré à une zone profil membre codée grâce à vos conseils avisés :)
J'espère ne pas trop en demander :/
Merci encore pour la qualité de vos tutos a très bientot
"
(auteur de ce tuto - 12 janvier 2011)
" Pour laisser uniquement les membres connectés poster un message, c'est simple, tu vérifie si la variable de session existe et si oui tu affiches le formulaire, sinon tu affiche un message pour dire qu'il faut être connecté avec un lien vers la page de connexion.
Voilà a+ "
(a acheté ce tuto - 12 janvier 2011)
" Déjà une réponse ^^ Salut simpledev oui je l'avais déjà vu mais comme j'ai suivi votre Tuto Créé un espace membre , je vois que sur celui la il y a pas besoin d'être connecté pour poster un commentaire donc mon espace membre me sert a rien j'imagine vu qu'il y a pas besoin de s'inscrire pour poster ^^ a moins que j'arrive a le modifié mais comme je débute plus facile a dire qu'a faire ^^
"
(auteur de ce tuto - 12 janvier 2011)
" Salut,
Merci pour ta bonne note, si tu veux un tuto sur un système de commentaire en AJAX, j'avais fais celui-là : http://fr.tuto.com/ajax_jquery/systeme-de-commentaire-en-ajax-avec-php-et-jquery-ajax-jquery,15172.html#tab_description
A bientôt pour d'autres tutos :) "
(a acheté ce tuto - 12 janvier 2011)
" Merci pour le Tuto le système de vote sans recharger la page est excellent , le tout bien sur expliqué très clairement , a quand un système de commentaire a la youtube ^^
En tout cas deuxième Tuto que j'achète chez vous et encore une fois pas déçus.
A + sur un prochain Tuto peut-être ;) "