Récupération de données XML dans un tableau

25 décembre 2016 à 1:10:15

Bonsoir,

Je dois arriver à partir d'un script à récupérer des données d'un fichier XML et d'enregistrer les valeurs dans un tableau. J'ai créé mon fichier XML. Par contre, je suis bloquée. Je ne sais pas par où commencer.

Est-ce que vous auriez quelques pistes?

MERCI ET BON RÉVEILLON

J'ajoute quand même le code de mon fichier XML. Je l'ai validé sur le site suivant: http://www.xmlvalidation.com/index.php

<?xml version="1.0" encoding="ISO-8859-1" standalone="yes" ?>
<!DOCTYPE Participation
[
	<!ELEMENT Participation (Enfant*)>
	<!ELEMENT Enfant (Identifiant, Prenom)>
	<!ELEMENT Identifiant (#PCDATA)>
	<!ELEMENT Prenom (#PCDATA)>
]>
<Participation>
	<Enfant>
		<Identifiant>ID1</Identifiant>
		<Prenom>Alexis</Prenom>
	</Enfant>
	<Enfant>
		<Identifiant>ID2</Identifiant>
		<Prenom>Benjamin</Prenom>
	</Enfant>
	<Enfant>
		<Identifiant>ID3</Identifiant>
		<Prenom>Carole</Prenom>
	</Enfant>
	<Enfant>
		<Identifiant>ID4</Identifiant>
		<Prenom>Daphnée</Prenom>
	</Enfant>
	<Enfant>
		<Identifiant>ID5</Identifiant>
		<Prenom>Émilie</Prenom>
	</Enfant>
	<Enfant>
		<Identifiant>ID6</Identifiant>
		<Prenom>François</Prenom>
	</Enfant>
</Participation>

J'ai essayé d'avancer un peu. Par contre, je ne sais pas du tout si ce que j'ai fait est bon.

Qu'en pensez-vous?

J'ai en même temps une question subsidiaire. En considérant que j'ai quatre paramètres (identifiant, nom, prénom, commune). Sachant aussi que nous avons uniquement firstChild et lastChild.

Comment puis-je récupérer les autres paramètres?

Finalement, ce que j'ai codé ne fait rien. C'est une nouvelle déception XD! Donc, il doit manquer pas mal d'instructions...

Quelqu'un a-t-il des idées?

MERCI ET JOYEUX NOËL

<!DOCTYPE html>
<html lang="fr">
    <head>
        <title>Récupération de données XML dans un tableau</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script language="javascript" type="text/javascript">
            function Enfant (identifiant, prenom)
            {
                this.identifiant = identifiant;
                this.prenom = prenom;
            }

            var resultats = recupererValeurs("fichier.xml");

            var listeEnfants = new Array();
            function recupererValeurs(nomFichier)
            {
                var enfants = nomFichier.getElementByTagName('Enfant');
                for(var i = 0; i < enfants.length; i++)
                {
                    var enfantTemporaire = new Enfant();
                    enfantTemporaire.identifiant(enfants[i].firstChild.data);
                    enfantTemporaire.prenom(enfants[i].firstChild.data);
                    listeEnfants.push(enfantTemporaire);
                }                
            }

            function afficherValeurs()
            {
                string = '\nLISTE DES ENFANTS\n\n';
                for(var i = 0; i < listeEnfants.length; i++)
                {
                    var enfantTemporaire = listeEnfants[i];
                    string += 'identifiant: ' + enfant.identifiant + '\n';
                    string += 'Prénom: ' + enfant.prenom + '\n';
                    string += '\n\n';
                }
                alert(string);                
            }

        </script>
    </head>
    <body>
        <section>
            <h1>Récupération de données XML dans un tableau</h1>
        <input type="button" onclick="afficherValeurs();" value="Afficher les valeurs">
        </section>
    </body>
</html>

-
Edité par AudreyMallus 29 décembre 2016 à 10:09:03

AudreyMallus

28 décembre 2016 à 14:48:35

Bonjour,

Il faut peut-être que je charge le fichier XML un peu comme en C avec une ouverture de fichier, une lecture ligne par ligne et une fermeture.

Qu'en pensez-vous?

Si quelqu'un a la réponse à mes autres questions, je suis preneuse.

MERCI ET BON RÉVEILLON

007julien

28 décembre 2016 à 15:09:00

Voir par exemple la page XML Applications de w3scholls.com

-
Edité par 007julien 28 décembre 2016 à 15:09:44

AudreyMallus

29 décembre 2016 à 10:23:54

Bonjour 007julien,

J'ai un peu avancé grâce à ton lien. Par contre, j'ai des erreurs. J'ai noté celles-ci à la ligne précisée par les outils de développement.

// ERREUR: Uncaught SyntaxError: Unexpected end of input

Je suppose qu'il faut lui préciser qu'il faut fermer le fichier à un endroit.

Je ne comprends pas du tout cette erreur.

Est-ce que quelqu'un aurait des pistes?

MERCI ET BON RÉVEILLON

<!DOCTYPE html>
<html lang="fr">
    <head>
        <title>Récupération de données XML dans un tableau</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script language="javascript" type="text/javascript">
            function Enfant (identifiant, prenom)
            {
                this.identifiant = identifiant;
                this.prenom = prenom;
            }

            var resultat1 = recupererValeurs("fichier.xml");
            var resultat2 = transfererValeursTableau();

            
            function recupererValeurs(nomFichier)
            {                
                var xmlhttp = new XMLHttpRequest();
                xmlhttp.onreadystatechange = function()
                {
                    if (this.readyState == 4 && this.status == 200)
                    {
                        myFunction(this);
                    }
                };
                xmlhttp.open("GET", nomFichier, true);
                xmlhttp.send();              
            }

            var listeEnfants = new Array();
            function transfererValeursTableau()
            {
                var xmlDoc = xml.responseXML;
                var enfants = xmlDoc.getElementsByTagName("Enfant");
                for(i = 0; i < enfants.length; i++)
                {
                    enfantTemporaire = new Enfant();
                    enfantTemporaire.identifiant = enfants[i].getElementsByTagName("Identifiant")[0].childNodes[0].nodeValue;
                    enfantTemporaire.prenom = enfants[i].getElementsByTagName("Prenom")[0].childNodes[0].nodeValue;
                    listeEnfants.push(enfantTemporaire);
            }

            function afficherValeurs()
            {
                string = '\nLISTE DES ENFANTS\n\n';
                for(var i = 0; i < listeEnfants.length; i++)
                {
                    var enfantTemporaire = listeEnfants[i];
                    string += 'identifiant: ' + enfant.identifiant + '\n';
                    string += 'Prénom: ' + enfant.prenom + '\n';
                    string += '\n\n';
                }
                alert(string);                
            } // ERREUR: Uncaught SyntaxError: Unexpected end of input
        </script>
    </head>
    <body>
        <section>
            <h1>Récupération de données XML dans un tableau</h1>
        <input type="button" onclick="afficherValeurs();" value="Afficher les valeurs"> <!-- Uncaught ReferenceError: afficherValeurs is not defined at HTMLInputElement.onclick --> 
        </section>
    </body>
</html>

AudreyMallus

1 janvier 2017 à 21:05:40

Bonsoir,

Quelqu'un aurait une solution?

MERCI ET BONNE ANNÉE

AudreyMallus

17 janvier 2017 à 23:08:34

Bonsoir,

J'ai avancé un peu. J'ai trouvé mes erreurs. Par contre, d'autres problèmes sont apparus. Ils me semblent plus compliqués à résoudre. J'ai vraiment besoin de pouvoir charger un fichier XML dans un fichier HTML pour d'autres exercices. Les erreurs sont mises en commentaires.

Est-ce que quelqu'un pourrait m'aider?

MERCI ET BONNE NUIT

<!DOCTYPE html>
<html lang="fr">
    <head>
        <title>Récupération de données XML dans un tableau</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script language="javascript" type="text/javascript">
            function Enfant (identifiant, prenom)
            {
                this.identifiant = identifiant;
                this.prenom = prenom;
            }

            var resultat1 = recupererValeurs("fichier.xml");
            var resultat2 = transfererValeursTableau("fichier.xml");

            
            function recupererValeurs(nomFichier)
            {                
                var xmlhttp = new XMLHttpRequest();
                xmlhttp.onreadystatechange = function()
                {
                    if (this.readyState == 4 && this.status == 200)
                    {
                        myFunction(this);
                    }
                };
                xmlhttp.open("GET", nomFichier, true);
                xmlhttp.send();
                // XMLHttpRequest cannot load file:///.../fichier.xml. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.            
            }

            var listeEnfants = new Array();
            function transfererValeursTableau(nomFichier)
            {
                var xmlDoc = nomFichier.responseXML;
                var enfants = xmlDoc.getElementsByTagName("Enfant");
                // Uncaught TypeError: Cannot read property 'getElementsByTagName' of undefined
                // at transfererValeursTableau (2.html:37)
                // at 2.html:15
                for(i = 0; i < enfants.length; i++)
                {
                    enfantTemporaire = new Enfant();
                    enfantTemporaire.identifiant = enfants[i].getElementsByTagName("Identifiant")[0].childNodes[0].nodeValue;
                    enfantTemporaire.prenom = enfants[i].getElementsByTagName("Prenom")[0].childNodes[0].nodeValue;
                    listeEnfants.push(enfantTemporaire);
                }
            return listeEnfants;
            }

            function afficherValeurs()
            {
                string = '\nLISTE DES ENFANTS\n\n';
                for(var i = 0; i < listeEnfants.length; i++)
                {
                    var enfantTemporaire = listeEnfants[i];
                    string += 'identifiant: ' + enfant.identifiant + '\n';
                    string += 'Prénom: ' + enfant.prenom + '\n';
                    string += '\n\n';
                }
                alert(string);                
            }
        </script>
    </head>
    <body>
        <section>
            <h1>Récupération de données XML dans un tableau</h1>
        <input type="button" onclick="afficherValeurs();" value="Afficher les valeurs">
        </section>
    </body>
</html>

-
Edité par AudreyMallus 17 janvier 2017 à 23:08:54

007julien

18 janvier 2017 à 9:57:03

la première erreur semble commander les autres.

Où se trouve le fichier "fichier.xml" ? Il doit être sur le serveur dans le même répertoire que la page, ou bien il convient de préciser le chemin.

S'il n'est pas sur le serveur, il faut l'uploader !

AudreyMallus

20 janvier 2017 à 12:52:43

Bonjour 007julien,

Les fichiers HTML et XML sont dans le même répertoire. Je n'utilise pas de serveur puisque c'est du JavaScript. Il faudra que je cherche pour uploader le fichier XML en JavaScript. Je mettrai mon avancement dès que possible.

Est-ce que quelqu'un a des pistes?

MERCI ET BONNE JOURNÉE