Dans ce tuto Ajax en vidéo, vous apprendrez à réaliser un système de message à la façon Twitter. Tout d'abord, nous créerons un script pour vérifier toutes les 15 secondes si il y a des nouveaux messages qui ont été postés. Si oui, nous afficherons au visiteur le nombre de messages non lus, et lorsque celui-ci cliquera sur le nombre de nouveaux messages, nous lui afficherons avec un petit effet de slide.
Nous utiliserons pour ce tuto, la librairie javascript Jquery ainsi qu'une base de données MySQL et bien sur PHP pour le langage serveur.
Bon tuto!
Jetez un oeil à ces autres tuto Ajax
AJAX et jQuery
Apprenez à utiliser des données dynamiques jQuery et AJAX…
Moteur de recherche AJAX /…
Dans ce tuto Ajax en vidéo, nous verrons comment réaliser…
Apprendre Ajax - JQuery
Voici une formation Jquery et Ajax complète, en vidéo, d'une…
Administration en AJAX et…
Dans ce tuto AJAX en vidéo, nous verrons comment ajouter, supprimer…
Formulaire de contact AJAX…
Dans ce tuto AJAX en vidéo, nous réaliserons un formulaire…
Espace membre en AJAX
Dans ce tuto Ajax en vidéo, nous verrons comment réaliser…
Notification instantanée
Dans ce tuto AJAX en vidéo, nous verrons comment réaliser…
Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto Ajax de 36 minutes est proposée dans une résolution plus grande que l’extrait suivant :
simpledev
, formateur certifié
Toutes les formations de Simpledev
Témoignage des clients de simpledev
![]()
Bravo continue comme ça parce que franchement grâce à toi ça va beaucoup mieux merci pour tout ce que tu fais.
![]()
Tutoriel clair et précis. Continuez ainsi :)
![]()
Tuto sur le codeigniter excellent par contre existe t il un tuto sur la création d'un back office avec codeigniter. Si oui, je suis fortement intéressée...
![]()
Superbes tutos pour apprendre Laravel ! Continue comme ça :D
![]()
Merci beaucoup pour tes tutorial que j'adore :D
Lire les autres témoignages
D'autres tuto de simpledev
Personnalisez vos champs de formulaire HTML5 en CSS
Dans ce tuto HMTL5 en vidéo, vous apprendrez à personnaliser vos champs de formulaire…
Détecter les requêtes AJAX en PHP
Dans ce tuto Ajax en vidéo, vous apprendrez à détecter en PHP si une requête est…
Effet de flou sur un texte en CSS 3
Dans ce tuto CSS 3 en vidéo, nous verrons comment créer un effet de flou en CSS3 sur…
Formulaire de contact AJAX, HTML5, CSS3, jQuery et Modernizr
Dans ce tuto AJAX en vidéo, vous apprendrez à réaliser un formulaire de contact en…
Notes attribuées par les utilisateurs (6 votes)
Les avis / Questions des utilisateurs (12)
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 Ajax d’une durée de 36 minutes a été téléchargé 408 fois et a reçu une note moyenne de 4/5.
Ce tuto a été publié le 28 juillet 2011 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.













(a téléchargé ce tuto - 07 mars 2012)
" @simpledev j'ai vérifié sur IE6 et IE8, la div #nombre n'est pas mise à jour. Donc apparemment la fonction count_messages() ne s’exécute pas correctement. Après pour dire si c'est ajax() ou un autre problème… Je ne m'y connais pas assez en JS pour le dire… "
(a téléchargé ce tuto - 06 mars 2012)
" @simpledev quand je poste un message, la div #nombre ne s'affiche pas dans IE 8 (pas testé le 7 ni le 9). Je n'avais pas pensé qu'il pouvait s'agir d'un problème de css, je vais faire quelques tests de mon côté. "
(auteur de ce tuto - 06 mars 2012)
" @Lefrein Logiquement Ajax ne pose pas de souci de compatibilité, ce doit être plutôt un souci de css. Quel est le problème exactement? "
(a téléchargé ce tuto - 06 mars 2012)
" @simpledev Ah d'accord. Je comprends ton point de vue.
Moi j'ai besoin d'une bonne compatibilité avec les différents navigateurs, j'ai donc fait des recherches pour savoir si ajax() est bien supportée mais sans trouver pour l'instant. Pourrais-tu me répondre à ce sujet ? Ou bien pourrais-tu m'indiquer un tuto qui explique bien ça ? "
(auteur de ce tuto - 05 mars 2012)
" @Lefrein Ce que je veux dire c'est que le tuto est un tuto sur la programmation qui traite de PHP et Jquery combinés pour avoir une application asynchrone, le but n'était pas d'avoir une application compatible avec tous les navigateurs du marché, d'ailleurs cela relèverait plus du domaine de l'intégration ce qui n'est pas trop mon domaine, j'avais fait ce tuto plus pour montrer une technique de développement qu'autre chose en fait. "
(a téléchargé ce tuto - 05 mars 2012)
" @simpledev un peu étonné par ta réponse.
Il me semble qu'IE8 - 7 ne sont pas des navigateurs négligeables en développement web.
Pour la gratuité, j'aurais payé avec plaisir, surtout que le tuto est, pour le reste, très bien fait. Mais j'aurais aimé savoir ça avant. "
(auteur de ce tuto - 04 mars 2012)
" @Lefrein Désolé mais c'était pas vraiment un tuto sur la compatibilité "Internet Explorer", de plus le tuto est gratuit je comprends pas trop pourquoi tu es si déçu uniquement parce qu'il ne fonctionne pas sur un navigateur... "
(a téléchargé ce tuto - 04 mars 2012)
" J'avais bien noté ce tuto qui m'a convaincu jusqu'à ce que je teste ma page sur internet explorer 8.
Ça ne marche pas. Vraiment déçu. "
(a téléchargé ce tuto - 04 mars 2012)
" Très bon tuto, clair et bien expliqué. Je regrette juste qu'il n'y ait pas quelques infos sur comment personnaliser le compte des messages non-lus mais sinon tout le reste est très bon. "
(a téléchargé ce tuto - 10 février 2012)
" Très bon tutoriel,
Agréable à voir étant donné qu'on va très vite au niveau du php tout en ayant des explications.
je le recommande malgré le son qui ne sort que sur une enceinte ( pas grave dutout, sa n'empêche pas d'apprendre )
Merci pour le partage "
(a téléchargé ce tuto - 11 septembre 2011)
" Super tuto à la Twitter :) "
(a téléchargé ce tuto - 28 juillet 2011)
" Comme d'habitude, un tuto clair et qui est toujours intéressant "