Showing posts with label XML. Show all posts
Showing posts with label XML. Show all posts

11 November 2006

Afisarea continutului unui fisier xml intr-o pagina html [partea a doua]

Acum vom afisa in pagina default.html un continut xml mai bogat.


Pentru asta, vom crea urmatoarele:

  • un document xml pe care il vom numi persoane.xml
  • un document html pe care il vom numi default.html


Deschidem autori.xml si introducem urmatoarele date:

<?xml version="1.0" encoding="utf-8" ?>

<persoane>
<persoana1>
<nume>Trifan</nume>
<prenume>Costin</prenume>
<varsta>28</varsta>
<tara>Romania</tara>
</persoana1>

<persoana1>
<nume>Trifan</nume>
<prenume>Lucian</prenume>
<varsta>25</varsta>
<tara>Romania</tara>
</persoana1>

<persoana1>
<nume>Trifan</nume>
<prenume>Cristian</prenume>
<varsta>24</varsta>
<tara>Romania</tara>
</persoana1>
</persoane>

Apoi, in tag-ul "body" din pagina default.html importam documentul xml:

<body>


Dupa care introducem datele din xml intr-un tabel:


<table datasrc="#persoane" cellspacing="0" cellpadding="0" width="100%"
align="left" border="1" >

<tbody>


<tr>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Nume:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Prenume:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Varsta:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Tara:</td>

</tr>

<tr>

<td style="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle; PADDING-TOP: 2px; TEXT-ALIGN: left"><span datafld="nume"></span></td>

<td style="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle; PADDING-TOP: 2px; TEXT-ALIGN: left"><span datafld="prenume"></span></td>

<td style="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle; PADDING-TOP: 2px; TEXT-ALIGN: left"><span datafld="varsta"></span></td>

<td style="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px;
VERTICAL-ALIGN: middle; PADDING-TOP: 2px; TEXT-ALIGN: left"><span datafld="tara"></span></td>

</tr>

<tr>

<td style="HEIGHT: 2px" colspan="4"></td>

</tr>

</tbody>

</table>





Dupa cum vedeti, nu a trebuit sa cream in tabel cate un rand pentru fiecare nod din documentul xml si asta din cauza ca atunci cand este vizualizata pagina in browser, acesta va citi fisierul xml si apoi va adauga in tabel atatea randuri cate sunt necesare pentru afisarea intregului continut al documentului xml.


Asta e tot !




Acum, default.html ar trebui sa arate astfel:


<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>

<body>
<xml id="persoane" src="persoane.xml"></xml>
<table border="1" datasrc="#persoane" width="100%" align="left" cellspacing="0"
cellpadding="0" bordercolor="#000080">
<tbody>


<tr>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Nume:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Prenume:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Varsta:</td>

<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;
background-color: #cccccc;">Tara:</td>

</tr>
<tr>
<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;"><span
datafld="nume"></span></td>
<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;"><span
datafld="penume"></span></td>
<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;"><span
datafld="varsta"></span></td>
<td style="text-align: left; vertical-align: middle; padding: 2 2 2 2;"><span
datafld="tara"></span></td>
</tr>
<tr>
<td colspan="4" style="height: 2px;"></td>
</tr>
</tbody>
</table>
</body>
</html>

10 November 2006

Afisarea continutului unui fisier xml intr-o pagina html [partea intai]

Pentru acest lucru avem nevoie de un fisier xml pe care il voi numi "cars.xml" si
o pagina html pe care o voi numi "default.html".

cars.xml va contine urmatorul cod:

<?xml version="1.0" encoding="utf-8" ?>

<cars>
<car1>
<model>Suzuki</model>
<type>Coupe</type>
<color>Red</color>
<year>2005</year>
</car1>
</cars>


In tag-ul "body" din pagina default.html, importam fisierul cars.xml:

<body>
<xml id="auto" src="cars.xml"></xml>

Apoi vom crea un tabel ca in exemplul de mai jos:

<table datasrc="#auto" border="1" width="27%" align="left" cellpadding="2" height="100" bordercolor="#000080" id="table1">

<tr>
<td width="70"><font color="#993300">Model: </font></td>
<td style="font: 9pt Verdana; "><span datafld="model"></span></td>
</tr>
<tr>
<td width="70"><font color="#993300">Type: </font> </td>
<td style="font: 9pt Verdana; "><span datafld="type"></span></td>
</tr>
<tr>
<td width="70"><font color="#993300">Color: </font></td>
<td style="font: 9pt Verdana; "><span datafld="color"></span></td>
</tr>
<tr>
<td width="70"><font color="#993300">Year: </font></td>
<td style="font: 9pt Verdana; "><span datafld="year"></span></td>
</tr>
</table>

Observati ca tabelului i-am adaugat proprietatea "datasrc" care are ca valoare "ID-ul" fisierului xml.

Apoi, fiecarui tag "span" i-am adaugat proprietatea "datafld" care are ca valoare numele fiecarui tag xml ( care contine date ) din "cars.xml".

De exemplu, primul tag "span" are ca valoare a parametrului "datafld" 'model', al doilea are 'type' s.a.m.d.

Astfel, putem afisa datele aflate intr-un fisier xml extern.

Ce este mai interesant, este faptul ca in momentul vizualizarii paginii html in browser, in cadul sursa nu apar datele
continute de fisierul xml.

La sfarsit, continutul fisierului "default.html" este acesta:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Default</title>
</head>

<body>
<xml id="auto" src="cars.xml"></xml>

<font size="5" color="#000080">Afisarea continutului unui fisier xml intr-o pagina html</font><div align="left">

<hr noshade color="#FF9900" align="left" width="75%" size="1">

<br />

<table datasrc="#auto" border="1" width="27%" align="left" cellpadding="2" height="100" bordercolor="#000080" id="table1">

<tr>
<td width="70">
<font color="#993300">Model: </font>
</td>
<td style="font: 9pt Verdana; ">
<span datafld="model"></span>
</td>
</tr>
<tr>
<td width="70">
<font color="#993300">Type: </font>
</td>
<td style="font: 9pt Verdana; ">
<span datafld="type"></span>
</td>
</tr>
<tr>
<td width="70">
<font color="#993300">Color: </font>
</td>
<td style="font: 9pt Verdana; ">
<span datafld="color"></span>
</td>
</tr>
<tr>
<td width="70">
<font color="#993300">Year: </font>
</td>
<td style="font: 9pt Verdana; ">
<span datafld="year"></span>
</td>
</tr>
<tr>
<td colspan="2" style="height: 2px;">
</td>
</tr>
</table>
</div>
</body>
</html>