transformer un code XML en une interface HTML

Version imprimable

Voir 40 message(s) de cette discussion en une page

1 pièce(s) jointe(s)

transformer un code XML en une interface HTML

Bonjour à tous,
SVP, je voudrais transformer ce code en XML en une interface HTML (ajoutée en dessous)

merci pour votre aide :oops:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<cuiModel><window id=‘window1'><div id=‘div1'>
<label id=‘label1’ value=‘searchPreference’/> 
<label id=‘label12’ value=‘seeFirst’/> <comboBox id=‘CB1’ name=‘criteriaCB’><item id=‘Item1’ Value=‘promotions’/>
<item id=‘item12’ Value=‘BestRated’/>
 </ComboBox></div>
<div id=‘div2'>
<label id=‘label2’ value=‘DisplayPreference’/> 
<label id=‘label21’ value=‘ResultDisplay’/> <comboBox id=‘CB2’ name=‘DispLayout’><item id=‘Item2’ Value=‘GridLayout’/>
<item id=‘item21’ Value=‘listlayout’/>
 </ComboBox></div>
<div id=‘div3'>
<label id=‘label3’ value=‘accessibilityPreference’/> 
<label id=‘label31’ value=‘contrastTheme’/> <ComboBox id=‘CB3’ name=‘CT’><item id=‘Item3’ Value=‘HighContrast’/>
<item id=‘item31’ Value=‘LowContrast’/>
 </ComboBox>
<label id=‘label4’ value=‘FontSize’/> <ComboBox id=‘CB4’ name=‘FS’><item id=‘Item4’ Value=‘larger’/>
<item id=‘item41’ Value=‘medium’/>
 </ComboBox> </div>
</window></cuiModel>

Pièce jointe 276891

18/05/2017, 14h15
thelvin

Hello,

ça risque d'être compliqué, il est mal formé ton XML. Aucun processeur n'en voudra. Il faut commencer par le corriger.

Je passe sur les apostrophes littéraires ‘ et ’ en lieu et place des apostrophes informatiques ' parce que je suppose que ce n'est qu'une histoire de copier/coller.

Mais il y a surtout une <comboBox>, c minuscule, qu'on essaie de fermer avec une </ComboBox>, C majuscule.

Ça ne va pas. Il faut commencer par avoir du XML correct.

merci bcp pour votre réponse Thelvin, j'ai corrigé les fautes et j'ai ajouté les deux derniers buttons. voilà le nouveau code:

Code:

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
<cuiModel>
<window id=‘window1'>
<div id=‘div1'>
<label id=‘label1’ value=‘searchPreference’/> 
<label id=‘label12’ value=‘seeFirst’/> 
<combobox id=‘CB1’ name=‘criteriaCB’>
<item id=‘Item1’ value=‘promotions’/>
<item id=‘item12’ value=‘BestRated’/>
</combobox>
</div>
<div id=‘div2'>
<label id=‘label2’ value=‘DisplayPreference’/> 
<label id=‘label21’ value=‘ResultDisplay’/> 
<combobox id=‘CB2’ name=‘DispLayout’>
<item id=‘Item2’ value=‘GridLayout’/>
<item id=‘item21’ value=‘listlayout’/>
</combobox>
</div>
<div id=‘div3'>
<label id=‘label3’ value=‘accessibilityPreference’/> 
 
<label id=‘label31’ value=‘contrastTheme’/> 
<combobox id=‘CB3’ name=‘CT’>
<item id=‘item3’ value=‘HighContrast’/>
<item id=‘item31’ value=‘LowContrast’/>
</combobox>
<label id=‘label4’ value=‘FontSize’/> 
<combobox id=‘CB4’ name=‘FS’>
<item id=‘item4’ value=‘larger’/>
<item id=‘item41’ value=‘medium’/>
</combobox> 
</div>
<div id='div4'>
<button id='but1'>ok</button>
<button id='but2'>cancel</button>
</div>
</window>
</cuimodel>
</window>
</cuiModel>

Le code n'est toujours pas bon (balises incongrues en double à la fin)

Corrigé ci dessous.

Ensuite, qu'as-tu déjà tenté en XSLT pour arriver à ton résultat ?

Code:

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
 
<cuiModel>
<window id='window1'>
<div id='div1'>
<label id='label1' value='searchPreference'/> 
<label id='label12' value='seeFirst'/> 
<combobox id='CB1' name='criteriaCB'>
<item id='Item1' value='promotions'/>
<item id='item12' value='BestRated'/>
</combobox>
</div>
<div id='div2'>
<label id='label2' value='DisplayPreference'/> 
<label id='label21' value='ResultDisplay'/> 
<combobox id='CB2' name='DispLayout'>
<item id='Item2' value='GridLayout'/>
<item id='item21' value='listlayout'/>
</combobox>
</div>
<div id='div3'>
<label id='label3' value='accessibilityPreference'/> 
 
<label id='label31' value='contrastTheme'/> 
<combobox id='CB3' name='CT'>
<item id='item3' value='HighContrast'/>
<item id='item31' value='LowContrast'/>
</combobox>
<label id='label4' value='FontSize'/> 
<combobox id='CB4' name='FS'>
<item id='item4' value='larger'/>
<item id='item41' value='medium'/>
</combobox> 
</div>
<div id='div4'>
<button id='but1'>ok</button>
<button id='but2'>cancel</button>
</div>
</window>
</cuiModel>

18/05/2017, 16h41
thouraya24

merci beaucoup Caballo, non j'ai pas testé avec XSLT. il n'y a pas d'outils pour le faire automatiquement?
18/05/2017, 16h46
caballo

"Automatiquement" c'est beaucoup dire...

Tu peux regarder des outils comme Altova StyleVision si tu ne veux pas mettre la souris dans le code. C'est un choix.
18/05/2017, 17h03
thouraya24

j'ai un problème de temps Caballo, j'espère que ça pourrait aller vite avec l'XSLT
19/05/2017, 10h55
caballo

"Vite" c'est relatif. Cela dépendra de ta vitesse d'appréhension du langage XSLT.
19/05/2017, 10h59
thelvin

Et du HTML et du CSS, et vu que ça a l'air d'être pour mobile, du HTML/CSS pour mobile aussi.

En gros il y a pas de contrainte de temps qui tienne. Embauche un dev dans une agence d'intérim si tu veux que ce soit fait vite.
19/05/2017, 15h18
thouraya24
Bonjour Caballo et Thelvin,

je voudrais selectionner tous les noeuds "label" du documents, donc je mets comme code :
Code:

1 2 3 4 5 <xsl:for-each select="label"> <label> <xsl:value-of select='label'> </label> </xsl:for-each>
toutefois, j'obtiens l'affichage des deux premières labels seulement ("searchpreferences", "seefirst")
20/05/2017, 16h32
thelvin

Hello,

ce code ne suffit pas, mets le reste aussi. En l'état il ne récupère aucun label, ni les premiers, ni les derniers, ni rien.

Bonjour Thelvin,

j'ai pu afficher les labels et aussi les combo box, toutefois j'ai pas su les imbriquer. voici les codes correspondants:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<xsl:template match="/">
<html>
<head>
<title/>
</head>
<body>
<xsl:apply-templates/>
 
</xsl:template>
</body>
</html>
</xsl:template >
 
<xsl:template match="div" >
 
    <label> <xsl:value-of select="label"/> 
	</label>
 
 
</xsl:template>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<xsl:template match="/"> 
 <html> 
 <body> 
<select>
<xsl:for-each select="combobox">
<option>
<xsl:value-of select="item"/>
</option>
</xsl:for-each>
</select>
 </body> 
 </html>
</xsl:template>

Bonjour,

voilà ma dernière version du fichier XSLT, mais il n'affiche toujours rien.

Code:

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
 
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/"> 
<html> 
<body> 
<xsl:for-each select="div">
<xsl:for-each select="label">
<label>
<xsl:value-of select=".">
</label>
 
<select>
<xsl:for-each select="combobox">
<option>
<xsl:value-of select="item"/>
</option>
</xsl:for-each>
</select>
</xsl:for-each>
</xsl:for-each>
 </body> 
 </html>
</xsl:template>
</xsl:stylesheet>

23/05/2017, 11h18
tsuji
Avec match="/", cela veut dire la racine du xml est le contexte pour le template. Directement sous elle, on ne trouve pas les éléments div. On les trouve par contre sous cuiModel/Window. C'est le raisonnement qu'on fait.
Code:

1 2 3 4  <xsl:for-each select="cuiModel/Window/div">
Comme ça, on arrive à quelque chose au moins. On peut l'améliorer à partir de là si on veut.

Bonjour Tsuji,

meme avec cette modification, il m'affiche toujours une page vide, j'essaye de tester le rendu de la page en utilisant ce site http://xslttest.appspot.com/

Code:

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
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="cuimodel/window/div"> 
<html> 
<body> 
 
<xsl:for-each select="label">
<label>
<xsl:value-of select="."/>
</label>
<select>
<xsl:for-each select="combobox">
<option>
<xsl:value-of select="item"/>
</option>
</xsl:for-each>
</select>
</xsl:for-each>
<xsl:for-each select="button">
<button>
<xsl:value-of select="."/>
</button>
</xsl:for-each> 
</body> 
</html>
</xsl:template>
</xsl:stylesheet>

23/05/2017, 16h42
tsuji
C'est bien satisfaisant qu'on continue d'inventer des choses qu'on puisse réclamer de soi-même, mais il faut le faire après on maîtrise le sujet. Maintenant, voyez-vous, vous réécrivez le template qui est différent de celui présenté auparavant. Vous ne voulez pas tester la version précedant?! Soit!
Code:

1 2 3 4  <xsl:template match="/cuiModel/window/div">
cuimodel ou cuiModel, c'est comme vous décidez, je ne vois pas de consistance.

Mais si vous fait ça, il se peut qu'il produit nombreux de html-body, donc, c'est mal. Dans le cas où il n'y a qu'un div là, ça va passer: mais théoriquement, loin d'être acceptable.
23/05/2017, 17h27
tsuji
J'ai regardé un peu plus,
[1] ça aussi
Code:

1 2 3 4  <xsl:for-each select="../combobox">
[2] Et puis, pour label
Code:

1 2 3 4  <xsl:value-of select="@value">
[3] Pour combobox
Code:

1 2 3 4  <xsl:value-of select="item/@value">
Et tous les quotes sont à revoir sur leur encodage. On dirait, il faut un peu de sérénité dans le travail.

MERCI TSUJI, merci tout le monde pour votre aide. j'ai apporté les modifs mais le code est toujours pas fonctionnel :(

Code:

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
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 
<xsl:template match="cuimodel/window/div"> 
<html> 
<body> 
 
<xsl:for-each select="label">
<label>
<xsl:value-of select="@value"/>
</label>
 
<select>
<xsl:for-each select="../combobox">
<option>
<xsl:value-of select="item/@value"/>
</option>
</xsl:for-each>
</select>
</xsl:for-each>
 
 
 </body> 
 </html>
</xsl:template>
</xsl:stylesheet>

30/05/2017, 09h54
caballo

Premièrement, au delà de l'analyse de ton code, et comme l'évoquait Tsuji, tu sais que le nom des balises XML est case-sensitive ? si tu ne nommes pas les balises avec le même nom entre le XML et le XSLT ca ne risque pas de fonctionner.

Bonjour Caballo, bonjour à tous,

ils sont bien conformes les noms de balises..., voilà le fichier XML

Code:

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
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="rt.xsl" ?>
<cuimodel>
<window >
<div>
<label id='label1'> searchPreference </label> 
<label id='label12'> seeFirst </label> 
<combobox id='CB1' name='criteriaCB'>
<item> promotions </item>
<item> bestrated </item>
</combobox>
</div>
 
<div>
<label id='label2'> mon </label> 
<label id='label21'> second  </label> 
<combobox id='CB2' name='DispLayout'>
<item> GridLayout </item>
<item> listlayout </item>
</combobox>
</div>
 
<div>
<label id='label13'> Preference </label> 
<label id='label122'> see </label> 
<combobox id='CB3' name='CT'>
<item> HighContrast </item>
<item> LowContrast </item>
</combobox>
</div>
 
<button>cancel</button>
<button>ok</button>
 
</window>
</cuimodel>

Voir 40 message(s) de cette discussion en une page