FR:Tutoriels:Apprendre Xajax en 10 minutes

xajax Wiki

Search

Toolbox

FR:Tutoriels:Apprendre Xajax en 10 minutes

Article

Discussion

Edit

History

[edit] Utiliser Xajax dans un script PHP

xajax est écrit pour être extrêmement simple à implémenter à la fois dans une application web existante que dans un nouveau projet. Vous pouvez ajouter la puissance de xajax dans quasiment tous les scripts PHP en 7 étapes :

Inclure la librairie de la classe xajax :
```
require_once("xajax.inc.php");
```
Instancier l'objet xajax :
```
$xajax = new xajax();
```
Enregistrer les noms des fonctions PHP que vous souhaitez pouvoir appeler à travers xajax :
```
$xajax->registerFunction("myFunction");
```

Écrire les fonctions PHP que vous avez enregistrées et utilisez l'objet xajaxResponse pour récupérer les commandes XML :

function myFunction($arg)
{
    // Faire quelques modifications sur $arg comme des requêtes sur la base de données et 
    // et le placer dan une nouvelle variable comme $newContent
    
    // Instancier l'objet xajaxResponse
    $objResponse = new xajaxResponse();
    
    // Ajouter une commande à la réponse pour assigner l'attribut innerHTML de
    // l'élément avec id="SomeElementId" avec le nouveau contenu
    $objResponse->addAssign("SomeElementId","innerHTML", $newContent);
    
    // Retourner la réponse XML de l'objet xajaxResponse
    return $objResponse->getXML();
}

Avant que votre script n'envoie un résultat, laisser xajax se charger des requêtes :
```
$xajax->processRequests();
```
Entre vos balises <head></head>, Dire à xajax de générer le javascript necessaire :
```
<?php $xajax->printJavascript(); ?>
```

Appeler la fonction depuis un évent javascript ou une fonction de l'application :

<div id="SomeElementId"></div>
<button onclick="xajax_myFunction(SomeArgument);">

C'est tout. xajax prend soin de tout le reste. Votre plus grosse tache est d'écrire les fonctions PHP et de retourner les réponse XML, ce qui est rendu très simple par la classe xajaxResponse.

[edit] Comment mettre à jour mon contenu de façon asynchrone ?

Peut être que la plus grande fonctionnalité unique de Xajax est la classe xajaxResponse. Les autres librairies Ajax requièrent que vous écriviez votre propre fonction de retour en javascript pour traiter les informations retournées d'une requête asynchrone et pour mettre à jour votre contenu. Xajax, d'un autre côté, vous permet de contrôler aisément votre contenu provenant de PHP. La classe xajaxResponse vous permet de créer des instructions XML de vos fonctions PHP à retourner dans votre application. Le XML est analysé par le moteur de message xajax et les instructions disent à xajax comment mettre à jour le contenu et l'état de votre application. La classe xajaxResponse offre actuellement un grand nombre de commandes utiles, telle que Assign, qui met l'attribut spécifié dans un élément de votre page; Append, qui permet d'ajouter l'attribut spécifié à la fin d'un élément de votre page; Prepend, qui permet d'ajouter l'attribut spécifié au début d'un élément de votre page; Replace, qui recherche et remplace les informations de l'attribut spécifié d'un élément de votre page; Script, qui exécute le code javascript spécifié; and Alert, qui affiche une boîte d'alerte avec le message spécifié.

Une seule réponse XML peut contenir de multiples commandes, qui seront exécutées dans l'ordre où elles ont été ajoutées dans la réponse. Par exemple, disons que l'utilisateur clique sur un bouton dans votre application. L'event onclick appelle l'emballage javascript d'appel de la fonction php. Cet emballage envoi une requête asynchrone au serveur à travers la fonction XMLHttpRequest où xajax appelle la fonction php. La fonction php fait une recherche sur la base de données, quelques manipulation de données, ou de la sérialisation. Vous utilisez la class xajaxResponse pour générer une réponse XML xajax qui contient de multiples commandes qui seront envoyés en retour au moteur de message xajax qui va les exécuter:

$objResponse = new xajaxResponse();
$objResponse->addAssign("myInput1","value",$DataFromDatabase);
$objResponse->addAssign("myInput1","style.color","red");
$objResponse->addAppend("myDiv1","innerHTML",$DataFromDatabase2);
$objResponse->addPrepend("myDiv2","innerHTML",$DataFromDatabase3);
$objResponse->addReplace("myDiv3","innerHTML","xajax","<strong>xajax</strong>");
$objResponse->addScript("var x = prompt(\"Enter Your Name\");");
return $objResponse->getXML();

Le moteur de message xajax va analyser le message xML et exécuter ceci:

La valeur de l'élément possédant l'id myInput1 va être assigné au informations dans $DataFromDatabase.
La couleur du texte dans l'élément possédant l'id myInput1 va être changée en rouge.
Les informations dans $DataFromDatabase2 vont être ajoutées à la fin du innerHTML de l'élément avec l'id myDiv1.
Les informations dans $DataFromDatabase3 vont être ajoutées au début du innerHTML de l'élément avec l'id myDiv2.
Toutes les occurrences de "xajax" dans l'innerHTML de l'élément avec l'di myDiv3 vont être remplacées par "xajax"; mettant toutes les occurrences du mot xajax apparaître en gras.
Une boîte de dialogue va être affichée demandant à l'utilisateur son prénom et la valeur retournée par la boîte de dialogue qui sera stockée dans une variable javascript nommée x.

Tout ceci est implémenté côté serveur dans la fonction php par création et envoi à xajax de la réponse XML.

[edit] Mais attendez, il y a plus !

Exécuter des formulaires avec Xajax

Retrieved from "http://www.xajaxproject.org/wiki/FR:Tutoriels:Apprendre_Xajax_en_10_minutes"