FAQ MooToolsConsultez toutes les FAQ

MooTools a créé la classe Request pour faciliter les appels AJAX. Cette classe comporte bon nombre d'options et d'évènements. Cependant, force est de constater que deux types de réponses sont généralement reçues lors d'une requête AJAX : un code HTML ou un objet JSON. C'est pourquoi Request connait deux déclinaisons qui sont Request.HTML et Request.JSON. Ces deux classes ont les mêmes options et méthodes mais en ajoutent certaines qui leur sont propres.

Request.HTML attend une réponse sous forme de code HTML. Ce code sera intégré dans l'arbre DOM.

Request.JSON attend une réponse sous forme d'objet JSON.

Ce code représente une requête AJAX simple :

var maRequete = new Request({
   url: 'fichierAjax.php',
   data: 'nom=lecteur',
   method: 'post',
   onRequest: function(){
      $('idDiv').set('text', 'Requête en cours...');
   },
   onSuccess: function(responseText){
      $('idDiv').set('text', responseText);
   },
   onFailure: function(){
      $('idDiv').set('text', 'Oups, ça ne fonctionne pas.');
   }
});

• url : URL vers laquelle est envoyée la requête.
• data : les données à transmettre.
• method : le type de requête. Il est par défaut à POST.
• onRequest : évènement représentant le démarrage de la requête.
• onSuccess : l'action à exécuter en cas de succès (le callback).
• onFailure : l'interception d'une erreur durant la requête.

Ce code représente une requête AJAX simple dont la valeur de retour est du code HTML :

var maRequeteHTML = new Request.HTML({
   url: 'fichierHTML.html',
   method: 'post',
   evalScripts: false,
   update: $('idDiv')
});

• url : URL vers laquelle est envoyée la requête.
• method : le type de requête. Il est par défaut à POST.
• evalScripts : permet d'exécuter ou non les scripts (JavaScript) présents dans la page.
• update : l'élément dans lequel sera ajoutée la réponse, à savoir du code HTML.

Ce code représente une requête AJAX simple dont la valeur de retour est un objet JSON :

var maRequeteJSON = new Request.JSON({
   url: 'fichierJSON.php',
   secure: true,
   onSuccess: function(responseJSON, responseText){
      $('idDiv').set('text', responseJSON.phrase
      + ', bonjour ' + responseJSON.prenom
      + ' ' + responseJSON.nom);
   },
   onError : function(text, error){
      $('idDiv').set('text', error + " -> " + text);
   }
});

• url : URL vers laquelle est envoyée la requête.
• secure : vérification ou non de la syntaxe de l'objet JSON.
• onSuccess : l'action à exécuter en cas de succès (le callback).
• onError : l'action à exécuter si secure détecte une erreur de syntaxe dans le JSON.

On interroge l'objet JSON de la manière suivante : responseJSON.clef.