|
JPAGE_CURRENT_OF_TOTAL Ajax est un des composants importants du Web 2.0 car il apporte souplesse et dynamismes aux sites web. Il se situe au croisement de trois langages que vous devez maîtriser avant d'aller plus loin dans ce tutorial : HTML, JavaScript, PHP (ou tout autre langage interprété par le serveur). Le but de la petite application Ajax que nous allons implémenté est, à partir d'un formulaire, de vérifier qu'un mot de passe est juste et afficher le résultat de la vérification sans rafraîchir la totalité de la page.
Pour bien mettre en évidence les différentes parties de l'implémentation, nous aurons trois fichiers : - implement.html : Contiendra un formulaire html très simple - implement.js : Contiendra nos fonctions JavaScript et l'utilisation du fameux XMLHttpRequest indispensable à la technologie Ajax - implement.php : Contiendra le petit script de vérification HTML Construisons d'abord le formulaire dans implement.html, lisez attentivement les commentaires : <html> <head> <!-- On inclut notre future fichier JavaScript --> <script type="text/javascript" src="/implement.js"></script> </head> <body> <!-- On déclare le formulaire en GET et en guise de page de soumission on appelle une fonction de notre futur fichier JavaScript. Le champs du password doit avoir une id. On récupèrera la valeur du champs grâce à cette id dans notre future fichier JavaScript --> <form method="GET" action="javascript:verifier()"> Password : <input type="text" id="pass" /><br /> <input type="submit" value="Vérifier" /> </form> <!-- Voilà l'endroit où le résultat sera affiché, reconnu dans notre future fichier JavaScript par son id. Pour le moment, on affiche rien. --> <p id="resultat"></p> </body> </html>
|
