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 jQueryAJAX et jQuery
Apprenez à utiliser des données dynamiques jQuery et AJAX…

Moteur de recherche AJAX / JqueryMoteur de recherche AJAX /…
Dans ce tuto Ajax en vidéo, nous verrons comment réaliser…

Notification instantanéeNotification instantanée
Dans ce tuto AJAX en vidéo, nous verrons comment réaliser…

Formulaire de contact ajaxFormulaire de contact ajax
Dans ce tuto AJAX en vidéo, vous réaliserez un formulaire…

Formulaire de contact AJAX avec PHP et JqueryFormulaire de contact AJAX…
Dans ce tuto AJAX en vidéo, nous réaliserons un formulaire…

Administration en AJAX et HTML5Administration en AJAX et…
Dans ce tuto AJAX en vidéo, nous verrons comment ajouter, supprimer…

Espace membre en AJAXEspace membre en AJAX
Dans ce tuto Ajax en vidéo, nous verrons comment réaliser…

Notification instantanéeNotification 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 :

Partagez cet extrait

Lien vers cet extrait : Embed code :

simpledev , formateur certifié



Toutes les formations de Simpledev


Témoignage des clients de simpledev

Un très bon formateur qui va au bout de ses explications. Ses tutoriels sont de qualité et je les recommande fortement ! Merci à vous pour ce que vous m'avez appris !

SimpleDev, tu es vraiment génial.2 ans que je te suis et ne te connais qu'a travers tes tutos mais passionné comme tu l' es , tu m'a donné l'envie d'avancer dans ce métier MERCI

De très bonne idée de tuto très bien réalisé . je recommande

Grâce à vos vidéos je commence à accélérer, vraiment merci. j’essaie de le pratiquer et de développer. Merci

Merci pour les tuto qui vraiment me font du bien

Lire les autres témoignages

 

D'autres tuto de simpledev

Personnalisez vos champs de formulaire HTML5 en CSSPersonnalisez 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 PHPDé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 3Effet 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 ModernizrFormulaire de contact AJAX, HTML5, CSS3, jQuery et Modernizr
Dans ce tuto AJAX en vidéo, vous apprendrez à réaliser un formulaire de contact en…

voir tous les tuto de simpledev

Notes attribuées par les utilisateurs (6 votes)

Note moyenne des utilisateurs  

Votez pour ce tuto


 

Les avis / Questions des utilisateurs (12)

par Lefreina voté :
(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… "

par Lefreina voté :
(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é. "

par simpledev
(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? "

par Lefreina voté :
(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 ? "

par simpledev
(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. "

par Lefreina voté :
(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. "

par simpledev
(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... "

par Lefreina voté :
(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. "

par Lefreina voté :
(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. "

par wordup258a voté :
(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 "

par tfloqueta voté :
(a téléchargé ce tuto - 11 septembre 2011)

" Super tuto à la Twitter :) "

par PeGaZe33a voté :
(a téléchargé ce tuto - 28 juillet 2011)

" Comme d'habitude, un tuto clair et qui est toujours intéressant "

 

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é 443 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.

N'hésitez pas à nous contacter si vous avez la moindre question !