Dans ce tuto AJAX en vidéo, nous verrons comment ajouter, supprimer et modifier des données en AJAX avec PHP, Jquery et HTML 5.

Pour cela nous prendrons l'exemple d'une administration de blog, où l'administrateur pourra ajouter, modifier et supprimer des articles.

Nous créerons donc une base de données, puis nous créerons un formulaire pour ajouter des articles et des boutons pour afficher et cacher ce formulaire. Ensuite, nous verrons comment valider ce formulaire avec Jquery et comment ajouter les informations en AJAX dans la BDD. Puis nous créerons un petite animation avec Jquery pour masquer le formulaire et afficher un message de succès lorsque les données ont été traitées.

Nous verrons également comment supprimer ces articles en AJAX, sans devoir recharger la page, avec bien sur une petite animation Jquery pour faire disparaître l'article que l'on vient de supprimer. Et enfin, nous verrons comment rendre nos articles "éditable" directement sur la page grâce à HTML 5 et Jquery, puis nous verrons comment faire pour que ces changements soit pris en compte en base de données sans avoir à recharger la page, et cela grâce à l'AJAX.

Jetez un oeil à ces autres tuto Ajax, HTML 5

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

Apprendre Ajax - JQueryApprendre Ajax - JQuery
Voici une formation Jquery et Ajax complète, en vidéo, d'une…

Conclusion : avantages et inconvénientsConclusion : avantages et…

La fonction $.getJSON avec FlickrLa fonction $.getJSON avec…

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

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…

Pagination en AJAXPagination en AJAX
Dans ce tuto AJAX en vidéo, vous apprendrez à réaliser un…

Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto Ajax, HTML 5 de 46 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

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

Très bon formateur de bonne qualité. J'aime.

Lire les autres témoignages

 

D'autres tuto de simpledev

Installer le framework Ruby On RailsInstaller le framework Ruby On Rails
Dans ce tuto Ruby On Rails en vidéo, nous verrons comment installer le framework Ruby…

Système de vote en AJAX avec CodeigniterSystème de vote en AJAX avec Codeigniter
Dans ce tuto Codeigniter en vidéo, nous allons mettre en place un système de votes…

Système de vote façon YouTubeSystème de vote façon YouTube
Dans ce tuto AJAX en vidéo, vous apprendrez à réaliser un système de vote à la manière…

Système de commentaire en AJAX avec PHP et JquerySystè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…

voir tous les tuto de simpledev

Notes attribuées par les utilisateurs (10 votes)

Note moyenne des utilisateurs  

Votez pour ce tuto


 

Les avis / Questions des utilisateurs (15)

par StevenRaivard
(a acheté ce tuto - 09 juin 2012)

" Ayé zé tout fini !!!

Merci encore simpledev, même appréciation que ton tuto sur l'espace membre :)

Petite question : Dans les fichiers sources quand on clique sur le texte de la page pour l'éditer le bord orange est absent contrairement à la vidéo !

Que dois-je faire ?

Bonne journée "

par almohaa voté :
(a acheté ce tuto - 22 décembre 2011)

" Très complet et très dense. A visionner plusieurs fois si vous êtes débutants (dont je suis). "

par vellaya voté :
(a acheté ce tuto - 17 novembre 2011)

" 5 "

par loysbog
(a acheté ce tuto - 12 juin 2011)

" bonjour,
Je cherche plus ou moins ce genre de tuto !
Enfin presque, je m'explique :
je cherche à créer une administration de site ou l'admin peut créer des article mais aussi ajouter des photos.
quelque chose de très structuré mais je demande peut être trop !?
Je vais déjà essayé de m'inspirer de ce tuto et voir ce que je peu faire!

Merci "

par ronytexasranger
(a acheté ce tuto - 08 mai 2011)

" Rien a dire la reference en matiere de tutoriel. "

par enigmaea voté :
(a acheté ce tuto - 07 mars 2011)

" Salut !!!

Le tuto est super sympas, le résultat est d'enfer, cependant je trouve dommage que tu ne décrives pas plus ce que tu fais.
Je veux dire par là que les applications en ajax, en php sont peu décrites. C'est dommage, j'aurai aimé apprendre réellement l'impact de ce que je fais car sinon j'aurai acheté des sources.
Merci cependant car ton aide concernant cette application est précieuse.

Bonne continuation !!! "

par nicob
(a acheté ce tuto - 26 décembre 2010)

" Bonjour, j'ai un petit soucis, j'ai un peu adapté le tutoriel pour faire une simple vérification des champs puis si tout est rempli je voudrais envoyer le tout sur la page de traitement (je veux charger ma nouvelle page et non faire le traitement dans la même page).

if(valid)
{
$.post(link,{jour: jour, mois: mois, annee: annee})
}

Je n'obtiens aucun résultat, rien ne charge. (Pourtant la gestion d'erreur se fait correctement). "

par colundruma voté :
(a acheté ce tuto - 26 décembre 2010)

" Excellent tuto surtout quand on va refaire son site perso. "

par Ziriuz
(n'a pas acheté ce tuto - 23 décembre 2010)

" Tu me l'offre en cadeau de noël ? :D Non? :O Bon ok j'ai compris je vais l'acheter ^^ "

par simpledev
(auteur de ce tuto - 23 décembre 2010)

" Salut Pegaze,
Non j'aime bien varier c'est tout :)
A+ "

par PeGaZe33a voté :
(a acheté ce tuto - 23 décembre 2010)

" Bonsoir ^^
Encore une fois, un tuto incontournable pour les amateurs du genre :)
Félicitation Mister :)

Malgré tout petite question (comme tjs diras-tu ! lol): Précédemment, tu vantais les bienfaits de la fonction "extract" et dans ce tuto, plus rien n'y fait référence.
Est-ce dû à un grande réflexion philosophique concernant cette fonction ou alors c'est lié aux contraintes techniques de l'Ajax ?

D'avance merci pour ta réponse et surtout, suite au prochain épisode attendu avec impatience (comme toujours ^^). "

par PeGaZe33a voté :
(a acheté ce tuto - 22 décembre 2010)

" Merci beaucoup :) "

par Ziriuz
(n'a pas acheté ce tuto - 22 décembre 2010)

" AAAAAAAh je le veux :D "

par simpledev
(auteur de ce tuto - 22 décembre 2010)

" Salut Pegaze, ça y'est les fichiers sources sont dispo.
A+ "

par PeGaZe33a voté :
(a acheté ce tuto - 22 décembre 2010)

" Bonjour,

Tuto qui va certainement être intéressant à suivre et surtout rempli de bons conseils :)
Par contre, pas de fichiers supports pour dire de pouvoir mieux suivre le tuto ?

Bonne continuation :) "

 

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, HTML 5 d’une durée de 46 minutes a été acheté 326 fois et a reçu une note moyenne de 5/5.

Ce tuto a été publié le 21 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'hésitez pas à nous contacter si vous avez la moindre question !