Asynchronous Javascript And Xml

Slides:



Advertisements
Présentations similaires
11:16:331 Programmation Web Programmation Web : Formulaires HTML Jérôme CUTRONA
Advertisements

Cours n°3 Les formulaires
PROGRAMMATION WEB FRONT-END.
Reformulation  L’AFPA promoteur du projet souhaite mettre en place une application WEB afin de remplacer une solution en Java. Pour ce projet 4 mandataires.
Choisir la source de données WinBooks * à partir de laquelle vous souhaitez travailler. Pour mémoire, Winbooks (tant AC que LO) est l’environnement naturel.
Présentation LabPlus v3. Solution novatrice en Technologies de l’information Solution novatrice en Technologies de l’information Application pour la Gestion.
Formation ExtJS 1 Vendredi 21 aout 2009 – Villeurbanne – Société IZEO.
Guide de l'enseignant SolidWorks, leçon 1 Nom de l'établissement Nom de l'enseignant Date.
Cours de HTML suite 3. Sommaire...  Les formulaires. Les formulaires.  Structure basique du formulaire, balise. Structure basique du formulaire, balise.
Répéter une action à intervalles réguliers
Nouveautés Version 4.1 et mai 2017.
AMUE – SIFAC Gestion des services fait sur SIFAC WEB
Support et Maintenance SIAN : MDEL partenaires
Thèmes du niveau « Expert »
Asynchronous Javascript And Xml
ATS8500 Standalone Downloader.
LOG2420 – Automne 2016 Chargé de cours : Mathieu Laprise
Messagerie (Orange - Gmail)
Comprendre l’environnement Web
Google analytics.
Organisation bureautique
PHP & MYSQL.
Initiation aux bases de données et à la programmation événementielle
Séminaire Novembre 2006 Zephir : Déploiement et supervision des serveurs Eole.
Initiation aux bases de données et à la programmation événementielle
LE MASHUP.
Javadoc et débogueur Semaine 03 Version A16.
Principes de programmation (suite)
Réalisation d'agents de surveillance Zephir
Internet Un réseau virtuel qui assure l'interconnexion des différents réseaux physiques par l'intermédiaire de passerelles. Une pile de protocoles unique.
Les technologies AJAX.
Asynchronous Javascript And Xml
Cyber-Sphinx Séance 2.
DREAMWEAVER Partie 2.
Esabora.as Dématérialisation.
Création d’un formulaire
Windev.
Documentation technique (Linux)
PROGRAMMATION INFORMATIQUE D’INGÉNIERIE II
AJAX et JQuery
Informations vous concernant :
3- Nouvelles pages d’accueil
Package R Markdown: Un outil pour générer des pages html avec R Studio
Guide Utilisateur. Guide Utilisateur.
DATA WEARHOUSE 1ère année LA: Technologies systèmes d’information
Programmation Android Bases De Données, SQL-lite
Introduction à Internet
Introduction à Internet
Formation sur les bases de données relationnelles.
Proposition de réponses attendues
Programmation Android Première application Android
Portail de saisie et de restitution
Portail de saisie et de restitution
Comment utiliser l’application ?
03- Evaluation Access 2003 Cette évaluation comporte des QCM (1 seule réponse) et des Zones à déterminer dans des copies d’écran.
Webaffiligue-Association
Catherine Cyrot - bibliothèques numériques - Cours 5
Bäz: Données relationnelles sécurisées
Système de gestion de contenu de sites web
Comment la faire ? Quand la faire ?
Présenté par Viviane Lévesque
Design, innovation et créativité
JQuery (Débutant) 24 Mars SUPINFO Orléans.
STS Web Services libres Gérer les services libres
STS Web Services libres Supprimer des services libres
Jquery, requêtes http, JSON et AJAX
Tapez les détails de votre événement ici
Les données structurées et leur traitement
Introduction aux technologies AJAX Ajax François BONNEVILLE
Transcription de la présentation:

Asynchronous Javascript And Xml

Qu'est-ce ? Principe XMLHttpRequest JSON AJAX/JQUERY

Qu'est-ce ? Apparu en 2005 dans un essai de James Garret. AJAX est le nom donné à un ensemble de techniques préexistantes : XHTML JAVASCRIPT DOM (Data Object Model) XMLHttpRequest XML/XSL XMLHttpRequest a été conçu par Mozilla sur le modèle d'un objet ActiveX nommé XMLHTTP créé par Microsoft.

Qu'est-ce ? Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière. Le terme "Asynchronous", signifie que l'exécution de JavaScript continue sans attendre la réponse du serveur qui sera traitée quand elle arrivera. En mode synchrone, le navigateur serait gelé en attendant la réponse du serveur.

Principe L'objet XMLHttpRequest permet de lancer des requêtes d'une page WEB vers le serveur pour y récupérer des fichiers au format XML. Le traitement se fait de façon asynchrone.

Principe html+css js ajax Evènement Envois de données URLEncoded Requête SQL Réception et traitement

Principe html+css js ajax Mise a jour d'un ou plusieurs élément de la page (mais pas rechargement de la page) js ajax Resultat requête Résultats mis en forme Réception et traitement

Ajax avec JQuery Jquery propose un objet ajax auquel il suffit de passer les différents paramètres nécessaires pour effectuer une requête ajax. $.ajax

paramètres de $.ajax $.ajax({ url: ... , data: ... , dataType: ... , success: function(donnees,status,xhr) { ... }, error: function(xhr,status,error) { } }); Nom du script devant traiter la requête Données à envoyer au serveur sous forme urlEncoded Type de données attendu en provenance du serveur (xml, json, script, html ou text) Méthode employée pour envoyer les données (GET ou POST) Actions à effectuer en cas de réponse positive du serveur. Actions à effectuer en cas de réponse négative du serveur.

Json JavaScript Object Notation est un format de données textuel, générique, dérivé de la notation des objets du langage ECMAScript. Il a été créé par Douglas Crockford en 1999 , et permet de représenter des informations de manière structurée.

Json Un document JSON ne comprend que deux éléments structurels : des ensembles de paires nom / valeur ; des listes ordonnées de valeurs.

Json [ { "nom":"bidochon", "prenom":"robert", "adresse":"SAINT-DIDIER-SUR-CHALARONNE" }, "nom":"galopin", "prenom":"raymonde", "adresse":"LEAZ" } ] Tableau JSON contenant 2 éléments chaque élément étant constitué de 3 champs

Ajax/json/Jquery/PHP Nom du département en fonction de son code afficherDepartement.html gestionFormulaireDept.js getNomDept.php fonctions.inc

Ajax/json/Jquery/PHP afficherDepartement.html

Ajax/json/Jquery/PHP gestionFormulaireDept.js Permet d'urlEncoder le champ ayant l'id nroDept

Ajax/json/Jquery/PHP getNomDept.php fonctions.inc Encodage du résultat au format json et envois de ce dernier

Les scénarii possibles 172.18.58.15/~dbernard/exempleDeBaseAjaxSnir1_2016/ExemplesAjaxSnir Afficher l'adresse d'une personne présente dans une liste déroulante 1 donnée Client Serveur 1 donnée Tester la validité d'un couple login/mot de passe n données Client Serveur 1 donnée 0 donnée Afficher une liste déroulante Client Serveur n données 172.18.58.15/~dbernard/exempleDeBaseAjaxSnir1_2016/ExemplesAjaxSnir https://www.amazon.fr/s/ref=sr_nr_n_1?rh=n%3A430351031%2Ck%3Aram&keywords=ram&ie=UTF8&qid=1410258132&rnid=1703605031 1 donnée Mettre à jour une liste déroulante en fonction d'une sélection Client Serveur n données n donnée Client Serveur n données

Conclusion html, javascript, php, json firebug est INDISPENSABLE ! Simple, si vous savez ce que vous devez envoyer et recevoir.