Ajax est une technique de programmation qui permet le développement de RIA (Rich Internet Applications). Les RIA sont des applications web caractérisées par une grande interactivité et une grande vitesse d'exécution.
Le traitement des données est effectué au niveau du client (navigateur) et les appels au serveur sont effectués en "arrière-plan" de manière asynchrone (Ajax signifie JavaScript et XML asynchrones).
Que signifie en termes simples que l'échange de données entre le client et le serveur se fait en arrière-plan ? Cela signifie que l'échange de données entre client et serveur permet la mise à jour dynamique de la page web sans la recharger et sans avoir à recharger une nouvelle page mais, surtout, il faut savoir qu'il n'est pas nécessaire d'attendre la requête pour être fait.. être complété pour en faire un autre.
Ajax n'est pas un langage de programmation mais un ensemble de technologies, voyons ce qu'elles sont :
Créer des applications interactives avec Ajax
Les applications Web qui utilisent Ajax nécessitent la dernière génération de navigateurs prenant en charge cette technologie. Tous les principaux navigateurs comme FireFox, Internet Explorer, Google Chrome, Opera et Safari prennent en charge Ajax, mais c'est une bonne idée de tester la compatibilité de vos applications.
Nous avons dit que les appels Ajax sont effectués en arrière-plan, et une fois la réponse renvoyée, seule une partie de la page (généralement un élément HTML comme le DIV) est modifiée. Cela peut également être un problème pour l'utilisateur qui, une fois l'appel effectué, voit la page Web « arrêtée » sans savoir que la demande d'information a de toute façon été envoyée au serveur.
Pour contourner ce problème, c'est une bonne idée de dédier un élément de page (un div est tout à fait approprié) à la description de l'interaction. Cela peut être fait avec du texte brut ou avec un chargeur qui montre "visuellement" à l'utilisateur qu'un échange de données a lieu.
Voyons techniquement comment on peut modifier dynamiquement le contenu d'une page web en utilisant la méthode innerHTML du DOM.
Supposons qu'il y ait un div sur notre page Web avec un ID de "contenu" unique. Nous pouvons modifier le contenu de la tranche à l'aide d'une fonction spécifique, puis l'appeler via un bouton. En changeant dynamiquement le style de la div, nous pouvons inventer une fonction qui affiche ou masque son contenu puis l'appelle avec un autre bouton.
Voyons maintenant comment effectuer une interaction "avancée" en envoyant une requête à une page côté serveur (dans notre exemple écrit en PHP) et en obtenant une réponse au format texte.
Examinons d'abord la page PHP (fichier.php)
La page reçoit une variable "user" en mode GET et vérifie que son contenu est "rouge". Si vous imprimez la phrase "Bonjour M. Rossi", sinon la phrase "Je ne vous connais pas". La réponse sera insérée dans la div avec l'identifiant unique "contenu" via Ajax.
Après avoir initialisé l'objet Ajax (vous pouvez consulter le code complet dans les fichiers qui accompagnent l'article) qui, entre autres, nous permet de vérifier qu'Ajax est compatible avec le navigateur, nous effectuons l'appel asynchrone en envoyant le contenu de la variable utilisateur et recevoir une réponse que nous avons choisi de stocker dans la variable de réponse.
Tout cela se fait à l'aide de la méthode Open (dont le troisième paramètre défini sur true spécifie que l'appel est asynchrone) puis de la méthode Send. Rien de bien compliqué, mais attardons-nous un instant sur la fonction. Vérifie l'état de l'interaction en retournant un entier (readyState) qui identifie l'état de la requête à tout moment.