IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

FAQ MooToolsConsultez toutes les FAQ

Nombre d'auteurs : 6, nombre de questions : 67, dernière mise à jour : 1 décembre 2012 

 
OuvrirSommaireLes technologies de l'AJAX

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.

Créé le 2012-12-01  par vermine, NoSmoking

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

 
Sélectionnez
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.
Créé le 2012-12-01  par vermine, NoSmoking

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

 
Sélectionnez
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.
Créé le 2012-12-01  par vermine

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

 
Sélectionnez
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.

Créé le 2012-12-01  par vermine, NoSmoking
  

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2010 Developpez Developpez LLC. Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.