XSLT multiples côté client, problème sous firefox

**elnarc** · 26/04/2006, 11h46

Bonjour à tous,

Tout d'abord je tiens à dire que j'ai fait de nombreuses recherches sur ce forum çi et ailleurs pour tenter de résoudre mon problème. En vain

Voilà donc le problème ..

J'utilise Javascript afin de faire du XSLT côté client. Je charge le fichier XML, le fichier XSL puis javascript procède à la transformation et intègre son résultat dans un div.

Aucun problème lorsque je n'effectue qu'une transformation par page.
Par contre, lorsque j'effectue 2 transformations dans une même page (mais dans 2 div différents), j'ai un problème sous firefox (et sous firefox uniquement, aucun problème sous IE).

En effet, seule la 2ième transformation est réalisée ..
J'ai donc un div vide et l'autre qui contient le résultat attendu.

Voilà le code html (simplifé bien sûr) :

Code :

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

1
2
3
4
5
<body onload="javascript:Transform('xml.php?d=menu', 'xsl.php?d=menu', 'menuPage'); Transform('xml.php?d=contenu', 'xsl.php?d=contenu', 'contenuPage');">

<div id="menuPage">Menu de la page</div>
<div id="contenuPage">Contenu de la page</div>

Donc le résultat est que si je fais une seule transformation, aucun problème, si j'en fais 2 seule la dernière est faite (sous firefox).

(xml.php et xsl.php servant bien sûr à générer du contenu xml et des feuilles de style xsl.)

Et voilà la fonction Transform et tout ce qui va avec ..

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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132

    //  platformMoz:  http://www.mozilla.org/projects/xslt/js-interface.html
    //  platformIE6:  http://www.perfectxml.com/articles/xml/XSLTInMSXML.asp

    var platformMoz = (document.implementation && document.implementation.createDocument);
    var platformIE6 = (!platformMoz && document.getElementById && window.ActiveXObject);
    var noXSLT      = (!platformMoz && !platformIE6);

    var msxmlVersion = '3.0';

    var urlXML;
    var urlXSL;
    var docXML;
    var docXSL;
    var target;
    var cache;
    var processor;
  var i;

    if (platformIE6)
    {
        // TODO... find out version of MSXML installed
        cache = new ActiveXObject('Msxml2.XSLTemplate.' + msxmlVersion);
    }

    function SetTarget(id)
    {
        target = document.getElementById(id);
    }

    function SetInput(url)
    {
        urlXML = url;
    }

    function SetStylesheet(url)
    {
        urlXSL = url;
    }

    function FatalError()
    {
        alert("Sorry, this doesn't work in your browser");
    }

    function CreateDocument(isXsl)
    {
        var doc = null;

        if (platformMoz)
        {
            if (!isXsl)
        doc = document.implementation.createDocument('', '', null);
      else 
        {
        doc = document.implementation.createDocument("http://www.w3.org/1999/XSL/Transform","stylesheet",null);
        }
        }
        else if (platformIE6)
        {
            doc = new ActiveXObject('Msxml2.FreeThreadedDOMDocument.' + msxmlVersion);
        }
        return doc;
    }

    function Transform(fichierXML, fichierXSL, divCible) 
    {
      SetTarget(divCible);
    SetInput(fichierXML);
    SetStylesheet(fichierXSL);
    
        if (noXSLT)
        {
            FatalError();
            return;
        }
        docXML = CreateDocument(false);
        docXSL = CreateDocument(true);
        
        if (platformMoz)
        {
            docXML.addEventListener('load', DoLoadXSL, false);
            docXML.load(urlXML);
        }
        else if (platformIE6)
        {
            docXML.async = false;
            docXML.load(urlXML);

            docXSL.async = false;
            docXSL.load(urlXSL);

            DoTransform();
        }
    }  

  function DoLoadXSL()
  {
      if (platformMoz)
      {
          docXSL.addEventListener('load', DoTransform, false);
          docXSL.load(urlXSL);
      }
  }

    function DoTransform() 
    {
        if (platformMoz)
        {
            processor = new XSLTProcessor();
            processor.importStylesheet(docXSL);

            var fragment = processor.transformToFragment(docXML, document);

            while (target.hasChildNodes())
                target.removeChild(target.childNodes[0]);

            target.appendChild(fragment);
        }
        else if (platformIE6)
        {
            cache.stylesheet = docXSL;

            processor = cache.createProcessor();
            processor.input = docXML;

            processor.transform();

            target.innerHTML = processor.output;
        }
    }

Voilà, désolé de livrer autant de code d'un coup, c'est indigeste .. mais étant donné que je ne sais pas du tout d'où vient l'erreur, je suis bien obligé de tout donner

Le dernier point, c'est le log apache lors de la visite de la page :

Code :

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

1
2
3
4
5
6
Sous IE

[26/Apr/2006:10:27:48 +0200] "GET /test/xml.php?d=menu HTTP/1.1" 200 265
[26/Apr/2006:10:27:48 +0200] "GET /test/xsl.php?g=menu HTTP/1.1" 200 699
[26/Apr/2006:10:27:49 +0200] "GET /test/xml.php?d=contenu HTTP/1.1" 200 190
[26/Apr/2006:10:27:49 +0200] "GET /test/xsl.php?g=contenu HTTP/1.1" 200 556

Code :

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

1
2
3
4
5
6
Sous Firefox

[26/Apr/2006:10:41:15 +0200] "GET /test/xml.php?d=menu HTTP/1.1" 200 265
[26/Apr/2006:10:41:15 +0200] "GET /test/xml.php?d=contenu HTTP/1.1" 200 190
[26/Apr/2006:10:41:15 +0200] "GET /test/xsl.php?g=contenu HTTP/1.1" 200 556
[26/Apr/2006:10:41:15 +0200] "GET /test/xsl.php?g=contenu HTTP/1.1" 200 556

Comme vous pouvez le voir, il y a une erreur de chargement sous Firefox .. j'ai beau tourner et retourner le code dans tous les sens, je ne comprend pas d'où elle vient .. besoin d'aide

Merci d'avance.

**siddh** · 26/04/2006, 11h51

as tu essayé de mettre une tempo en faisant un setTimeout pour le deuxieme ?

**elnarc** · 26/04/2006, 12h00

Bonjour,

Je viens d'essayer et en effet le setTimeout résoud le problème !
Merci beaucoup !

Donc le problème viendrait de la synchronisation des transformations ?
Comment le résoudre ?

(Dans l'exemple je n'ai que 2 transformations, mais à terme si j'en ai une quinzaine, ca serait ennuyeux d'avoir à attendre entre chacune

)

**siddh** · 26/04/2006, 12h04

ben le probleme vient du temps de reponse du serveur, si il diffère entre les deux browsers, c est peut etre du a des headers ?

bien souvent, un timeout de 100 suffit, ce qui fait 100ms ce qui n'est pas énorme

**elnarc** · 26/04/2006, 12h10

Ok d'accord.

Mais ce que je ne comprend pas c'est pourquoi javascript lance les 2 transformations en "parrallèle" (puisque les chargements se chevauchent sous firefox).
Il n'y a pas une instruction qui permettrait de lancer une transformation uniquement après que la précédente se soit terminée ?

(Dans tous les cas merci encore, je suis en local j'ai pu descendre à 50ms de délai, quasiment rien donc .. mais j'aimerai une solution "propre"

)

**siddh** · 26/04/2006, 12h22

ben en theorie ca devrais se mettre dans la file, je t'avouerais que j'ai jamais fais ça du coup je connais pas

XSLT multiples côté client, problème sous firefox

JavaScript

Discussions similaires

Partager

Partager