[Exan]

Hi everyone, I’m trying to create a table using XSL/XML. I'm new to XSL and XML, so go easy on me please />/>
I’m having a bit of trouble with a few things.
This is my XML file:

<List>
	<Classification>
		<Class>
			<Label>Milk</Label>
			<NumberZone>1</NumberZone>
			
			<Zone>
				<Label>Milk1</Label>
				<Frontier>500</Frontier>
			</Zone>

			<Zone>
				<Label>Milk2</Label>
				<Frontier>600</Frontier>
			</Zone>

			<Zone>
				<Label>Milk3</Label>
				<Frontier>600</Frontier>
			</Zone>

			<Zone>
				<Label>Milk4</Label>
				<Frontier>700</Frontier>
			</Zone>
			
			<image>
				<File>milk.jpg</File>
			</image>
		</Class>

		<Class>
			<Label>Water</Label>
			<NumberZone>2</NumberZone>

			<Zone>
				<Label>Water1</Label>
				<Frontier>800</Frontier>
			</Zone>

			<Zone>
				<Label>Water2</Label>
				<Frontier>900</Frontier>
			</Zone>
			
			<image>
				<File>water.jpg</File>
			</image>
		</Class>

		<Class>
			<Label>Juice</Label>
			<NumberZone>3</NumberZone>

			<Zone>
				<Label>Juice1</Label>
				<Frontier>950</Frontier>
			</Zone>

			<Zone>
				<Label>Juice2</Label>
				<Frontier>990</Frontier>
			</Zone>
			
			<image>
				<File>juice.jpg</File>
			</image>
		</Class>

	</Classification>
</List>

It normally is longer, but I cut out some parts.

I wanted the table to look like this:
First column: Milk, Water, Juice...
Second column: I want the images.
Third column: Milk1, Water1, Juice1.
Fourth column: Milk2, Water2, Juice2.
(And so on).


So far I have this:

<table border="1">
	 
	 <tr><th>Type of class</th><th>Image</th><th>List of zones</th></tr>
	
	
			<xsl:for-each select="Classification/Class">
			<tr>
				<td><em><xsl:value-of select="Label" /></em></td>
				
				<td>
				<xsl:attribute name="src">
				<xsl:value-of select="image/File"/>
				</xsl:attribute>
				</td>
				
				<td><xsl:value-of select="Zone/Label"/></td>
				<td colspan="1"><xsl:value-of select="Zone/Label"/></td>
				<td colspan="1"><xsl:value-of select="Zone/Label"/></td>
				</tr>
			</xsl:for-each>
</table>

This shows the first colum perfectly with Milk, Water, and Juice.
The second column doesn't work, it's just blank. The image won't appear in the table, any idea on how to fix this?*
The third column also works perfectly showing Milk1, Water1, Juice1.
The fourth column doesn't work, obviously, because I'm using the same value-of as in the third column. I don't know how to get Milk2, Water2, and Juice2 to show in that column, since it uses the same element name (being Zone/Label)

So there's two thing I need to fix: I need to fix the second column to actually show the image in each boxes.
I also need to fix the fourth column to show Milk2, Water2, and Juice2.

My main problem for now is to get the fourth column to work, I really don't understand how to display Milk2, Water2, etc.


I would also like to add checkboxes in each table cell, because I would like to add Javacript to my web page later on, and for each checkbox something different would happen.
How would I do this?

How to insert check boxes would also be a huge help, I feel like each check box would need a different ID, wouldn't it? How would I do that using XSL/XML?

Thanks!

[Dormilich]

Second column problem: in HTML images are displayed through the <img> element …

fourth column, I’d also have expected problems with the third column. however, what you need to do is specify, which <Zone> element you want to access. you do that as if it were an array: ./Zone[1]/Label, ./Zone[2]/Label, etc.

This post has been edited by Dormilich: 12 December 2012 - 03:53 AM

[Exan]

Thank you I got this to work.

[baavgai]

Best advice I can give someone starting out in XSLT is to avoid for-each as much as possible. Also, <xsl:attribute name="src"> is old hat.

e.g.

<xsl:template match="Classification">
	<table border="1">
		<tr><th>Type of class</th><th>Image</th><th>List of zones</th></tr>
		<xsl:apply-templates select="Class"></xsl:apply-templates>
	</table>
</xsl:template>

<xsl:template match="Class">
	<tr>
		<td><em><xsl:value-of select="Label" /></em></td>
		<td><img src="{image/File}"/></td>
		<xsl:apply-templates select="Zone/Label"></xsl:apply-templates>
	</tr>
</xsl:template>

<xsl:template match="Zone/Label">
	<td><xsl:value-of select="." /></td>
</xsl:template>