[XML/XSL - JavaScript]

**arkham55** · 27/04/2010, 21h00

Bonsoir à tous et toutes,

J'ai un petit soucis les amis, pour le javascript je débute, et pour le XML/XSL j'ai déjà fait pas mal de tests très instructifs. Mon objectif, pour le test problématique, était de récupérer une liste filtrée de produits, sur base d'un attribut. Celui-ci étant un niveau de réapprovisionnement que l'on encode dans une field sur une page html. Au moyen du JavaScript, je voudrai pouvoir récupérer la liste filtrée et l'afficher sous le champ(et bouton) sur la page html.
Bref, j'ai essayé pas mal de façons différentes mais j'ai toujours une "erreur sur la page" d'après IE...
Lorsque j'ouvre mon fichier xml (associé au fichier de style xsl) la liste s'affiche nickel, avec le niveau de réappro que j'ai entré
Fichier XSL :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 <!--<xsl:param name='niveau'>25</xsl:param>-->
<xsl:template match="/">
 
<html>
<head>
 <style type="text/css">
          table { border-collapse: collapse;
          border: solid black 1px;
          margin-left:150px;}
          td { padding: 3px;
          border: solid black 1px;}
          th { padding: 3px;
          border: solid black 2px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
 
</head>
 
<body>
        <p align="center">
          <font size="4" face="Imprint MT Shadow">Liste filtrée</font>
        </p>
        <table width="800px">
          <TR>
			<TH> Position </TH>
            <TH> Référence </TH>
            <TH> Libellé </TH>
            <TH> N° fournisseur </TH>
            <TH> Catégorie </TH>
            <TH> Quantité/unité </TH>
            <TH> Prix unitaire </TH>
            <TH> Stock </TH>
            <TH> Unités commandées </TH>
            <TH> Niveau réapprovisionnement </TH>
            <TH> Indisponible </TH>
          </TR>
          <xsl:element name="p"><xsl:value-of select= '$niveau' /></xsl:element>
             <xsl:for-each select="dataroot/Produits[Niveau_de_réapprovisionnement=$niveau]"> 
                 <xsl:sort select="Nom_du_produit" 
                          data-type="text" 
                          order="ascending"/>
 
            <tr>
			  <td width="25%" size="12px">
                *<xsl:number value="position()" format="1. "/>
              </td> 
              <td width="25%" size="12px">
                *<xsl:value-of select="Réf_produit"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Nom_du_produit"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="N_fournisseur"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Code_catégorie"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Quantité_par_unité"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Prix_unitaire"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Unités_en_stock"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Unités_commandées"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Niveau_de_réapprovisionnement"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Indisponible"/>
              </td>
            </tr>
 
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
 
</xsl:stylesheet>

Fichier html avec JavaScript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Liste des produits / niveau de réapprovisionnement</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function lister(niv)
{
			// On charge la feuille XSL
            var feuilleXsl = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.4.0"); 
            feuilleXsl.async = false; 
            feuilleXsl.load("styleProd.xsl"); 
 
			// On charge le document XML
            var docXml = new ActiveXObject("Msxml2.DOMDocument.4.0"); 
            docXml.async = false; 
            docXml.load("Produits.xml"); 
 
			// On transforme
            var xslt = new ActiveXObject("Msxml2.XSLTemplate.4.0"); 
            xslt.stylesheet = feuilleXsl; 
            var procXsl; 
            // On crée un processeur xslt
            procXsl = xslt.createProcessor(); 
            //On lui soumet le doc xml
            procXsl.input = docXml; 
            //traitement
            procXsl.addParameter('niveau', niv);
            procXsl.transform(); 
            //On récupère la sortie du traitement
			var resultat = procXsl.output;
			var entete = 'Saisir un autre niveau<br /><form name="formulaire"><input name="niv" type="text"><br /><input type="button" name="recherche" value="Recherche" onClick="trie(this.form.niv.value)"></form>';
			//Affichage du résultat
             document.body.innerHTML = entete + resultat;
 
}
</script>
</head>
 
<body>
    <font face="Comic sans ms" size="3">Entrez un niveau de réapprovisionnement</font><br />
    <form name="formulaire">
        <input name="niv" type="text"><br />
        <input type="button" name="recherche" value="Recherche" onClick="trie(this.form.niv.value)">
    </form>
</body>
</html>

Voilà les fichiers, je ne poste pas le xml vu que ma liste s'affiche correctement depuis le xml. Mais si ça peut vous aider selon vous, je veux bien en afficher un bout!
Merci d'avance pour votre aide.
Arkh

**Erwy** · 28/04/2010, 08h57

C'est normal que tu appelles

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onClick="trie(this.form.niv.value)"

alors que ta fonction c'est

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

function lister(niv)

?

**arkham55** · 28/04/2010, 20h11

Merci beaucoup pour ton aide, j'ai effectivement modifié l'incohérence, mais cela n'a pas réglé le problème

En bas de mon navigateur, un message me signal une erreur sur la page.
Mais je ne vois pas d'où cela prend sa source :s

**arkham55** · 29/04/2010, 19h08

Je peux faire ce que je veux, je n'arrive pas à récupérer la valeur entrée dans le field sur ma page html dans mon xsl. Voici la dernière version du code :
xsl :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Liste des produits par niveau de réapprovisionnement</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function lister(niv)
{
			// On charge la feuille XSL
            var feuilleXsl = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.4.0"); 
            feuilleXsl.async = false; 
            feuilleXsl.load("styleProd.xsl"); 
 
			// On charge le document XML
            var docXml = new ActiveXObject("Msxml2.DOMDocument.4.0"); 
            docXml.async = false; 
            docXml.load("Produits.xml"); 
 
			// On transforme
            var xslt = new ActiveXObject("Msxml2.XSLTemplate.4.0"); 
            xslt.stylesheet = feuilleXsl; 
            var procXsl; 
            // On crée un processeur xslt
            procXsl = xslt.createProcessor(); 
            //On lui soumet le doc xml
            procXsl.input = docXml; 
            //traitement
            procXsl.addParameter('niveau', niv);
            procXsl.transform(); 
            //On récupère la sortie du traitement
			var resultat = procXsl.output;
			var entete = 'Saisir un autre niveau<br /><form name="formulaire"><input name="niv" type="text"><br /><input type="button" name="recherche" value="Recherche" onClick="lister(this.formulaire.niv.value)"></form>';
			//Affichage du résultat
             document.body.innerHTML = entete + resultat;
 
}
</script>
</head>
 
<body>
    <font face="Comic sans ms" size="3">Entrez un niveau de réapprovisionnement</font><br />
    <form name="formulaire">
        <input name="niv" type="text"><br />
        <input type="button" name="recherche" value="Recherche" onClick="lister(this.formulaire.niv.value)">
    </form>
</body>
</html>

et le xsl :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 <!--<xsl:param name='niveau'>25</xsl:param>-->
<xsl:template match="/">
 
<html>
<head>
 <style type="text/css">
          table { border-collapse: collapse;
          border: solid black 1px;
          margin-left:150px;}
          td { padding: 3px;
          border: solid black 1px;}
          th { padding: 3px;
          border: solid black 2px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
 
</head>
 
<body>
        <p align="center">
          <font size="4" face="Imprint MT Shadow">Liste filtrée</font>
        </p>
        <table width="800px">
          <TR>
			<TH> Position </TH>
            <TH> Référence </TH>
            <TH> Libellé </TH>
            <TH> N° fournisseur </TH>
            <TH> Catégorie </TH>
            <TH> Quantité/unité </TH>
            <TH> Prix unitaire </TH>
            <TH> Stock </TH>
            <TH> Unités commandées </TH>
            <TH> Niveau réapprovisionnement </TH>
            <TH> Indisponible </TH>
          </TR>
          <xsl:element name="niveau"><xsl:value-of select= '$niveau' /></xsl:element>
             <xsl:for-each select="dataroot/Produits[Niveau_de_réapprovisionnement=$niveau]"> 
                 <xsl:sort select="Nom_du_produit" 
                          data-type="text" 
                          order="ascending"/>
 
            <tr>
			  <td width="25%" size="12px">
                *<xsl:number value="position()" format="1. "/>
              </td> 
              <td width="25%" size="12px">
                *<xsl:value-of select="Réf_produit"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Nom_du_produit"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="N_fournisseur"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Code_catégorie"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Quantité_par_unité"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Prix_unitaire"/>
              </td>
              <td width="25%" size="12px">
                *<xsl:value-of select="Unités_en_stock"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Unités_commandées"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Niveau_de_réapprovisionnement"/>
              </td>
              <td width="25%" size="12px" align="center">
                *<xsl:value-of select="Indisponible"/>
              </td>
            </tr>
 
          </xsl:for-each>
        </table>
      </body>
    </html>
  </xsl:template>
 
</xsl:stylesheet>

Merci encore pour le temps investit.

**Morbo** · 03/05/2010, 10h58

Tant que le navigateur d'indique que c'est un pb de javascript autant virer toute la partie xml/xsl et résoudre le pb de javascript.
En l'occurence ici, j'ai fait un test rapide et la bonne syntaxe semble être :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

lister(formulaire.niv.value)

sans le "this"

[XML/XSL - JavaScript]

XML/XSL et SOAP

Discussions similaires

Partager

Partager