Problème d'encodage des accents lors de transformation d'un XSL en HTML à partir d'un XML

Bonjour,

Je dois réaliser un fichier HTML grâce à un fichier XSL qui fait appel à du XML.

C'est un catalogue de piscines qui reprend automatiquement les données du fichier XML grâce à un template "photo" et donc qui crée lui même les div par rapport au nombre de piscines qui sont dans le fichier XML. (div id catalogue qui contient Xdiv class photo en fonction du nombre)

J'ai bien encodé le fichier XSL et le fichier XML en UTF-8 (XML : <?xml version="1.0" encoding="UTF-8"?> et XSL : <?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:fn="http://www.w3.org/2005/xpath-functions">
<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>).

Cependant lors de la transformation en HTML, les accents pètent.. (ex : PRÉSENTATION) et du coup je ne comprends pas pourquoi.. une idée ?

[ame="http://www.flickr.com/photos/82018808@N02/7603009220/"]Capture d?e?cran 2012-07-19 a? 14.04.18 | Flickr - Photo Sharing![/ame]
[ame="http://www.flickr.com/photos/82018808@N02/7603009298/"]Capture d?e?cran 2012-07-19 a? 14.03.46 | Flickr - Photo Sharing![/ame]
[ame="http://www.flickr.com/photos/82018808@N02/7603009132/"]Capture d?e?cran 2012-07-19 a? 14.04.33 | Flickr - Photo Sharing![/ame]

J'aimerais également pouvoir lui préciser un doctype, cependant quand j'ajoute le doctype dans le fichier XSL, une fois le fichier transformé en HTML, le catalogue de piscine bug complètement (juste la partie CSS des div catalogue et photo), savez-vous pourquoi ?

[ame="http://www.flickr.com/photos/82018808@N02/7603021648/"]Capture d?e?cran 2012-07-19 a? 14.16.31 | Flickr - Photo Sharing![/ame]

Dernière question, j'ai une "div id banniere" qui doit contenir ce texte en javascript : "<script type="text/javascript">
document.write("<img name='pic' src='"+pic[mis[i]]+"' title='"+pic[mis[i]]+"' alt='js'>");
</script>"

[ame="http://www.flickr.com/photos/82018808@N02/7603026706/"]Capture d?e?cran 2012-07-19 a? 14.18.00 | Flickr - Photo Sharing![/ame]

Savez-vous comment je peux écrire cette partie de code javascript en XSL ?

D'avance merci beaucoup pour votre réponse. (tous les liens sont les captures d'écran)

Bonjour,

Citation:

---

J'ai bien encodé le fichier XSL et le fichier XML en UTF-8 (XML : <?xml version="1.0" encoding="UTF-8"?> et XSL : <?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:fn="http://www.w3.org/2005/xpath-functions">
<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>).

---

C'est un bon début, mais cela ne suffit pas toujours. Il faut vérifier si tes fichiers ont bien été enregistrer en prenant en charge UTF-8 et il y a peu être ton processeur XSLT à configurer, vérifier aussi éventuellement les arguments de ta ligne de commande, ...

Citation:

---

J'aimerais également pouvoir lui préciser un doctype

---

C'est avec l'élément xsl:output que tu peux faire cela.

Citation:

---

Savez-vous comment je peux écrire cette partie de code javascript en XSL ?

---

Utilise les éléments xsl:element et xsl:attribut si ton code est fonction de tes données.
Sinon, si ton code javascript ne change pas alors tu peux utiliser

Code:

---

1 2	<![CDATA[ ton code javascript ici ]]>

---

Bonjour,

merci pour ta réponse !

- Pour la configuration du processeur, j'utilise XML Spy comme programme et je sais pas trop où chercher, je connais pas trop, mais je vais essayer d'exporer cette piste. (ca semble pourtant jouer selon l'image ci-dessous)

[ame="http://www.flickr.com/photos/82018808@N02/7603224164/"]Capture d?e?cran 2012-07-19 a? 15.06.15 | Flickr - Photo Sharing![/ame]

- Pour le doctype, c'est justement quand je lui ajoute un doctype avec xsl:output que ca fait bugger le css :/

- Parfait mon code ne change pas, j'ai donc écrit :

<![CDATA[<script type="text/javascript">
document.write("<img name='pic' src='"+pic[mis[i]]+"' title='"+pic[mis[i]]+"' alt='js'>");
</script>]]>

Merci beaucoup ;)

Citation:

---

Envoyé par elixes19

- Pour la configuration du processeur, j'utilise XML Spy comme programme et je sais pas trop où chercher, je connais pas trop, mais je vais essayer d'exporer cette piste. (ca semble pourtant jouer selon l'image ci-dessous)

---

Il est probable que la page HTML soit bel et bien en utf-8, mais que le navigateur n'ait aucun moyen de le savoir.

Il faudrait que dans les <head>...</head> tu ajoutes :

Code:

---

<meta charset="utf-8" />

---

Ça devrait améliorer les choses.

Citation:

---

Envoyé par elixes19

- Pour le doctype, c'est justement quand je lui ajoute un doctype avec xsl:output que ca fait bugger le css :/

---

Attention, mettre un doctype ou ne pas en mettre, ça change pas mal de choses avec CSS.
Lis ce que tu peux trouver sur l'opposition quirks mode/standart mode, et sur le doctype-switching.
Il y a tout un monde là-dedans, mais en résumé, on ne fait pas le même CSS si on met un doctype ou si on n'en met pas.

Au passage : il faut choisir. Soit tu fais du HTML, soit du XHTML. output="html" n'est pas adapté pour faire du XHTML. Les risques ne sont pas énormes, mais il y en a.
Et soit dit en passant, le XHTML c'est dépassé. Du bon vieil HTML est plus habituel. XSLT ne peut pas générer de doctype HTML5, donc il faudra se rabattre sur un doctype HTML 4.01.

Je n'avais pas vu qu'il y avait des liens au dessus des images :roll:

En fait, vu que utilise un navigateur, donc un serveur aussi j'imagine, c'est toute la chaîne qu'il faut érifier pour la prise en charge de l'UTF-8 : l'éditeur de XML, le fichier XML, le processeur XSLT, ton fichier HTML effectivement avec une balise meta, mais aussi l'en-tête de tes requêtes http, la prise en charge par ton navigateur (par exemple avec Firefox, Affichage >> Encodage des caractères) et éventuellement, puisque tu utilise du javascript, le code qui va avec. J'en ai oublié, mais c'est déjà pas mal :)

Sinon pour générer du HTML5, il faudrait, à priori utiliser :

Code:

---

1 2 3 4 5

<xsl:output method="xml" doctype-system="about:legacy-compat" encoding="UTF-8" indent="yes" />

---

J'ai bien le <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">, donc c'est pas ça non plus je pense.

Sinon je fais bien du html4.

En fait je dois reproduire un fichier html avec le XSL. Le fichier HTML ayant comme doctype :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

J'aimerais bien pouvoir avoir le même doctype une fois la transformation XSL faite, mais c'est la que ca fait bugger le CSS.

Pour l'encodage, ce n'est pas un problème de firefox (il gère de toute facon l'UTF-8), c'est une fois que je fais la transformation avec le fichier XSL qu'un fichier HTML avec les caractères qui pètent est généré. Donc ce serait plutot dans le programme XSL, mais comme j'ai dit avant, j'ai vérifié dans les options.. :?

Sinon y'a aussi un souci avec le javascript dans la div, il me remplace les "<" et ">" par des &lt; --'

Citation:

---

Envoyé par elixes19

J'ai bien le <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">, donc c'est pas ça non plus je pense.

---

Mouais. Moi je crois ce que je vois. 'Faudrait qu'on jette un œil au .xslt et au .html généré.

Citation:

---

Envoyé par elixes19

Sinon je fais bien du html4.

---

Pourquoi veux-tu un doctype XHTML 1.0, alors ?

Citation:

---

Envoyé par elixes19

J'aimerais bien pouvoir avoir le même doctype une fois la transformation XSL faite, mais c'est la que ca fait bugger le CSS.

---

Je t'en ai déjà parlé. Fais ce que j'ai dit.

Citation:

---

ce n'est pas un problème de firefox (il gère de toute facon l'UTF-8

---

C'est effectivement sympathique que Firefox "gère",
mais ce que je voulais dire c'est qu'il faut le PARAMETRER
afin qu'il prenne effectivement UTF-8 en charge.

Pour les caractères < et &lt;, ... un peu de doc à propos de CDATA t'indiquera comme faire,
là pour le cout, ce n'est pas compliquer.

Citation:

---

Envoyé par polymorphisme

Pour les caractères < et &lt;, ... un peu de doc à propos de CDATA t'indiquera comme faire,
là pour le cout, ce n'est pas compliquer.

---

Un peu quand même -_-°.

Une solution possible, en générant du XHTML, est de mettre dans le <xsl:output> l'attribut :

Code:

---

cdata-section-elements="script"

---

Mais en réalité, le mieux serait de ne pas mettre ce script dans le HTML. Il faudrait le mettre dans un fichier .js appelé à part, comme on fait avec les CSS. Ça élude le problème simplement.

Bonsoir,

Merci pour toutes vos réponses ;)

J'ai résolu le problème de la bannière, suffisait de mettre les script à l'extérieur du CDATA :

<div id="banniere">
<script language="Javascript" type="text/javascript">
<![CDATA[document.write("<img name='pic' src='"+pic[mis[i]]+"' title='"+pic[mis[i]]+"' alt='js'>");
]]></script>
</div>

Je sais que c'était mieux de les mettre à part, mais pour cette ligne, j'étais obligée de la mettre là.

Pour Firefox, cela n'a à priori rien à voir car c'est le programme XMLSPY qui génère le HTML et qui crée directement dans le code :

<div id="presentation"><a href="presentation.html">PRÉSENTATION</a></div>

Sinon pour le doctype, c'est effectivement du xhtml , mais le CSS pète complètement, alors que le code semble juste.. suffit d'enlever le doctype pour que le CSS soit ok.

Doctype que j'aimerais :

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:fn="http://www.w3.org/2005/xpath-functions">
<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />

(la ça pète..)

Si je mets ca ça marche :

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:fn="http://www.w3.org/2005/xpath-functions">
<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>

Je pense que c'est peu être le output "xhtml" qui bug.. si je met "html" c'est bon..

Merci pour vos réponses ;)

Citation:

---

J'ai résolu le problème de la bannière, suffisait de mettre les script à l'extérieur du CDATA

---

Ok, c'est une solution qui fonctionne, mais je ne saurais que te conseiller de mettre tout ton code javascript dans le CDATA et d'utiliser l'attribut que t'a indiqué thelvin. Pour faire simple: c'est plus propre, et si tu as a géré une documentation plus complexe ou plusieurs scripts, tu le comprendras vite :)

Code:

---

<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />

---

Là, ca ne peut pas fonctionner correctement ! Tu indique le format html pour ta sortie, mais tu lui colle un DTD qui celle d'un format XML, résultat le document résultant de ta sortie ne sera jamais valide, et il y a des chances pour que la feuille de style CSS ne soit pas appliquée comme tu l'attends par le navigateur.

Ca doit effectivement être le problème alors !

J'aimerais ça :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

J'ai donc essayer comme ça dans le XSL, mais ça fait péter le CSS :

<xsl:output
method="xhtml" encoding="utf-8" media-type="text/html" omit-xml-declaration="yes"
doctype-public= "-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
indent="yes" />

En quelle langue faut-il que je le dise ? C'est à cause du doctype-switching.
Si tu ne mets pas de doctype à ton HTML, le css est interprété en mode quirks, et même si le résultat te plaît, il est tout sauf correct.

Inutile de s'énerver, t'as meilleur temps de pas répondre à ce moment ! ;)

J'ai bien compris ce que tu me dis, sauf que je ne connais vraiment pas le doctype switching ou le quirks, je vais donc me débrouiller.

Sinon pour l'encodage, c'est réglé.

Citation:

---

Envoyé par elixes19

Inutile de s'énerver, t'as meilleur temps de pas répondre à ce moment ! ;)

---

Pas faux, mais d'un autre côté, quand quelqu'un ignore clairement les instructions que je lui donne, je me réserve le droit de râler sur lui de façon totalement irrationnelle. Surtout quand ces instructions sont exactement ce qu'il lui fallait.

D'ailleurs c'est pas si irrationnel que ça : si quelqu'un fait une recherche et tombe sur cette discussion, je préfère qu'il soit bien clair qu'on t'avait déjà répondu. C'est juste que toi tu n'avais pas lu la réponse.

Citation:

---

Envoyé par elixes19

J'ai bien compris ce que tu me dis, sauf que je ne connais vraiment pas le doctype switching ou le quirks, je vais donc me débrouiller.

---

Comme je l'ai dit (ça aussi,) il y a ce nouveau truc nommé Google. Pas besoin de te débrouiller, tout est là.

Citation:

---

Envoyé par elixes19

Sinon pour l'encodage, c'est réglé.

---

Ça aurait pu être sympa de dire ce qu'était le problème et comment tu l'as résolu. Même si je te plais pas, c'est pas moi que ça pourrait aider. Moi j'ai pas de problème.

Je ne sais pas comment l'encodage s'est réglé, j'ai juste transformé sur un autre ordinateur. Du coup je pense qu'il y avait un souci avec mon logiciel.

Concernant le doctype, toujours le même problème. Apparemment :

"Si le seul fait d'ajouter un Doctype, correspondant à la version de (X)HTML que vous utilisez, suffit à modifier l'apparence de votre site, c'est simplement que vous avez composé votre code HTML avec des techniques dépassées (bien que valides)."

Mais je n'ai pas encore trouver comment résoudre le problème. ;)

J'ai enfin trouvé l'erreur !

Je dois être fatiguée pour n'avoir pas remarqué jusque là.. c'était pas un problème de doctype, c'était que j'avais mis un "div class="Photo" à la place d'un "div class="photo" :cry:

Merci en tout cas pour votre précieuse aide à tous. :lol: