Site de formation en ligne dédié aux nouvelles technologies de l’information
Exemple 1: traitement d'une réponse de type texte. |
<html> <head> <title>Exemple 1</title> <script type="text/javascript" language = "javascript"> xhr = false; xhr = new XMLHttpRequest(); /* Fonction de traitement d'une requête Ajax: * Cette fonction accepte deux paramètres - url: page qui reçoit la requête - destination: objet de la page html dans lequel le résultat sera affecté. Tester cet exemple avec les fichiers suivants: ajax0.txt (Contenu: <strong>Bonjour </strong> ajax.php (Contenu:
<?php
setlocale((LC_TIME,"fra");
echo '<strong>' . strftime("%A %B %Y"). '</strong> World !';
?>
*/ function requete(url, destination) { /* Etape 1 Création d'une instance de l'objet XMLHttpRequest *************************************************************/ //Vérification si l'instance a été créée avec succès */ if(xhr) { /* Etape 2: Initilisation de la requête à l'aide de la méthode open ******************************************************************* * paramètre 1: Méthode http GET ou POST * paramètre 2: url de la page qui reçoit la requête sur le serveur http, si la requete envoie des paramètres et que la méthode http utilisée est GET alors il faut préciser aussi la valeur de ces paramètres. Exemeple http://serveur/page?p1=v1&p2=v2. paramètre 3: peut prendre deux valeurs true: la requête est envoyée en mode asynchrone (valeur par défaut). false: la requête est envoyée en mode synchrone paramètre 4: nom d'utilisateur (optionnel) paramètre 5: mot de passe (optionnel) */ xhr.open("GET", url); /* Etape 3: Envoi de la requête: ******************************** * la méthode send envoie la requête au serveur http (l'équivalent de la méthode submit() d'un formulaire) elle accepte un paramètre qui peut prendre l'une des valeurs suivantes: * null : si la requête n'admet aucun paramètre ou si la méthode d'envoi est GET. * liste des paramètres de la requête */ xhr.send(null); /* Etape 4: Réception de la réponse *********************************** * Si la requête est envoyée en mode asynchrone, on doit définir un gestionnaire d'événement qui * sera appelé à chaque fois que l'état de la requête change, l'état d'une requête ajax est * défini par l'attribut xhr.readyState qui prend les valeurs suivantes 0 (requête non initialisée) : avant l'appel de * la méthode open 1 (requête initilisée, mais non encore envoyée au serveur): avant l'appel de la méthoode send 2 (reqête envoyée) : 3 (en cours de réception) 4 (terminée) : réponse entièrement reçue. * le gestionnaire d'événement (une fonction javascript) est défini par l'attribut * xhr.onreadystatechange, dans cette exemple * une fonction javascript anonyme est utilisée. */ xhr.onreadystatechange = function() { //objet html dans lequel le résultat sera affecté. var obj = document.getElementById(destination); // On teste si la réponse est entièrement téléchargée (xhr.readyState==4 ) et que la page est reçue // sans erreur (xhr.status==200) if (xhr.readyState == 4 && xhr.status == 200) { /** Affichage du résultat de la requête */ obj.innerHTML = xhr.responseText; // On peut aussi affihcer le résultat en utilisant cette instruction /* document.f.zone1.value= xhr.responseText;*/ }// fin if } //fin fonction anonyme } //fin if(xhr) }// fin fonction get </script> </head> <body> <H1>Exemple 1</H1> <form name="f"> <input type = "button" value = "Message" onclick = "requete('http://localhost/web2/ajax0.txt', 'te')"> <input type="text" name="zone1" id="zone"> </form> <div id="te"> <p></p> </div> </body> </html>
Exemple 2: récupération d'un document XML |
/* Document XML utilisé dans cet exemple ajax2.xml: <root><personne><nom>Larbi</nom><age>3</age></personne> <personne><nom>Dana</nom><age>4</age></personne> <personne><nom>Lima</nom><age>32</age></personne> */ <html> <head> <title>Exemple 1</title> </head> <body> <H1>Données XML</H1> <script type="text/javascript" language = "javascript"> xhr = false; xhr = new XMLHttpRequest(); if(xhr) { url="http://localhost/web2/ajax2.xml"; xhr.open("GET", url); xhr.send(null); xhr.onreadystatechange = function() { if (xhr.readyState == 4 && xhr.status == 200) { // Récupération du document XML xml= xhr.responseXML; var str = ''; //personne est de type nodeList qui contient la liste des éléments "personne" var personne = xml.getElementsByTagName("personne"); for (i=0 ; i<personne.length ; i++) { //p est un noeud de type Element "personne" p=personne.item(i); //p.firstChild est un élément de type nom // l'élément nom ne contient qu'un seul noeud de type Text: le nom de la personne. //(ceci sera vrai uniquement si le document xml ne contient aucun espace entre // en dehors des éléments noms et age) on accède à ce noeud uniqueà l'aide de // firstChild. var nom = p.firstChild.firstChild.nodeValue; var age = p.lastChild.firstChild.nodeValue; str += nom + ' ' + age + '<br />'; /* ___ le code suivant fonctionne même si le document xml contient des espaces ou des sauts ___ de ligne for (i=0 ; i<xml.getElementsByTagName('personne').length ; i++) { var personne = xml.getElementsByTagName('personne')[i]; var nom = personne.getElementsByTagName('nom')[0].firstChild.nodeValue; var age = personne.getElementsByTagName('age')[0].firstChild.nodeValue; str += nom + ' ' + age + '<br />'; } */ }// fin for document.write(str); }// fin if } //fin fonction anonyme } //fin if(xhr) </script> </body> </html>
{Consulter} l'article avec son forum.
Atelier 1
1. Créer un programme qui extrait et affiche des nombres binaires valides dans une chaîne de caractères (nom du fichier de description at1_1.l, nom du programme at1_1.exe),
le format d’affichage doit être comme suit :
Nombre binaire : 010101
Tester votre programme avec différentes chaînes et notez les nombres binaires reconnus à partir des chaînes suivantes :
a. 10154697411014100000014
b. A10101b98741e418574
c. 10 1014
2. Créer un programme similaire au précédent et qui reconnaît des nombres octaux at1_2.exe)
3. Créer un programme at1_3 qui reconnaît des nombres hexadécimaux.
4. Créer at1_4 qui reconnait des nombres binaires, octaux et hexadécimaux.
(NB : créer un analyseur insensible à la casse)
5. Testez votre programme avec les chaînes suivantes :
a. 1000111
b. 1234
c. fg
d. f10014108h100017845123
Noter les résultats obtenus.
Atelier 2
Ecrire un programme qui reconnaît les identificateurs C valides dans un fichier et les affiche.
Atelier 3
Ecrire un parseur qui analyse un fichier et remplace toutes les occurrences du symbole @ par [at]
Atelier 4
Ecrire un programme qui lit un fichier C et qui reconnaît les unités lexicales (ou lexèmes) suivantes :
· un type de données
· un identificateur
· un commentaire
· un opérateur
· un mot clé (for, break, exit, while, return)
{Consulter} l'article avec son forum.
Contenu :
Indexeurs
1. Gestion des employés
Créer une classe Employe contenant les champs suivants :
· _matricule : un nombre entier qui doit être incrémenté automatiquement par le système lors de la création d’un nouvel employé)
· _nom
· _prenom
· _dateNaissance
· _villeNaissance
· _salaire
· _nombreEmployes : champ entier statique
a. Créer les propriétés correspondantes (les propriétés nombreEmployes et matricule doivent être en lecture seule.)
b. Créer un indexeur qui permet d’accéder aux informations d’un employé en utilisant les noms des propriétés.
c. Initialiser la propriété statique dans un constructeur statique.
d. Créer un constructeur par défaut et un constructeur à quatre.
e. Ecrire une méthode Employe rechercherEmploye (int mat) qui retourne l’employé dont le matricule est donné en paramètre.
f. Créer une application de gestion d’un employé :
i. Ajout
ii. Suppression
iii. modification
iv. Recherche
v. Navigation : premier, précédent, suivant et dernier.
vi. Affichage du nombre d’employés
2. Jeu de dès
Réaliser une application qui simule un jeu de dès à chaque clic sur le bouton jouer, on affiche d’une manière aléatoire quatre dès dans les quatre étiquettes de la fenêtre.
a. Créer une classe NombreAleatoire qui contient une propriété (en lecture seule) nommée Val et qui retourne un nombre aléatoire compris entre 1 et 6.
b. Créer un objet Form contenant quatre étiquettes et un bouton de commande.
c. L’objet Label possède une propriété Image qui peut contenir une image (formats:png,gif)
Indications
Classe Random
La classe Random génère des nombre aléatoires de type byte, int et double
Méthodes :
· int Next() : retourne un nombre aléatoire entier. dans l’intervalle [0, +2,147,483,646]
· int Next(int n) : retourne un nombre aléatoire entier. dans l’intervalle [0, n[.
· int Next(int a, int b) : retourne un nombre aléatoire entier. dans l’intervalle [a,b[
Classe Image
La méthode Image.FromFile("nom_fichier_image") : crée et retourne un objet de type Image.
Obtenir le chemin de du dossier courant : Directory.GetCurrentDirectory()
{Consulter} l'article avec son forum.
| {Site réalisé avec le logiciel SPIP} | {IT FORMATION} | {Plan du site} |