Ajax c'est quoi
L'Ajax ('Asynchronous
Javascript and XML) est une combinaison de plusieurs technologies qui permet de récupérer des
données sans à avoir à recharger la page.
L'exemple le plus parlant est Google Map. Vous pouvez scroller le monde entier sans recharger la page. En fait à chaque
action de scrolling, la page demande aux serveurs de Google de lui retourner les informations de cartographie sur les
coordonnées vu par l'utilisateur, ainsi on utilise que les ressources nécessaires. Sans l'ajax, il aurait fallu
recharger la page à chaque changement de coordonnées, ou alors précharger toutes les données de la Terre entière, mais
évidemment ca ne serait pas possible.
Utiliser Ajax
JQuery simplifie l'utilisation d'Ajax.
Syntaxe ajax
JQUERY:
| <script> |
|---|
| $.ajax(<param>); |
|---|
| </script> |
|---|
| async | Par defaut toutes les requetes sont asynchrones ( true par defaut ) |
|---|
| beforeSend | execute une fonction avant l'envoi de la requete Ajax |
|---|
| cache | Par défaut: true, false pour le dataType 'script' and 'jsonp' |
|---|
| complete | Execute une fonction lorsque la requete est terminée |
|---|
| contentType | Par defaut: application/x-www-form-urlencoded; charset=UTF-8 |
|---|
| data | Les données que vous souhaitez envoyer |
|---|
| dataType | Par defaut: Intelligent Guess sinon (xml, json, script, or html) |
|---|
| error | Execute une fonction en cas d'erreur |
|---|
| password | Si besoin d'un mot de passe pour l'authentification HTTP access |
|---|
| success | Execute une fonction en cas de reussite de la requete ajax |
|---|
| type | Par defaut: GET. Sinon POST |
|---|
| url | Par defaut: la page en cours. |
|---|
| password | Si besoin d'un mot de passe |
|---|
| username | Si besoin d'un utilisateur pour l'authentification HTTP access |
|---|
Exemple:
| <script> |
|---|
| $.ajax({ |
|---|
| url : "script.php", |
|---|
| data : { "action" : "delete_page" }, |
|---|
| complete: function(){ |
|---|
| alert("Félicitation page supprimée!"); |
|---|
| }, |
|---|
| error: function(){ |
|---|
| alert("Erreur!"); |
|---|
| } |
|---|
| }); |
|---|
| </script> |
|---|
Récupérer le retour Ajax
Envoyer des données au server en ajax c'est une chose mais on peut récupérer son retour et le traiter en local via le navigateur.
UNE QUESTION SUR L'ARTICLE?
CSSW