Hi I am having trouble displaying a table in my webpage using XSLT.
My XSL template seems fine and displays the tabular data but I am unsure how to display it in a div tag? Any ideas?
*********xsl code**********
<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:template match="/">
<html>
<head>
<title>Images in XSLT</title>
<style>
table {table-layout: auto; text-align:left; margin-left: auto; margin-right: auto;}
td, th {border:1px single silver; padding:5px; width:15%px;}
p { font-family:Verdana; font-size:10px; color:silver;margin-bottom;0px;}
</style>
</head>
<body>
<center>
<h3>Carp Stuff limited</h3>
<table border = "1">
<xsl:for-each select="carpstuff/tackleitem">
<xsl:sort select="itemname" data-type="text" />
<tr>
<td>
<xsl:apply-templates select="image" />
</td>
<td>
Item Name:<xsl:value-of select="itemname" /><br />
Brand Name: <xsl:value-of select="brandname" /><br />
<p>Catalogue Number:<xsl:value-of select="catalogueref" /><br />
Comments: <xsl:value-of select="comments" /><br />
<xsl:apply-templates select="cost" />
</p>
</td></tr>
</xsl:for-each>
</table>
</center>
</body>
</html>
</xsl:template>
<xsl:template match="image">
<img>
<xsl:attribute name="src">
<xsl:value-of select="." />
</xsl:attribute>
<xsl:attribute name="width">
60
</xsl:attribute>
</img>
</xsl:template>
<xsl:template match="itemname">
<p>
<xsl:attribute name="style">
font-family:Verdana;font-size:10pt;color:silver;
</xsl:attribute>
<xsl:value-of select="." />
</p>
</xsl:template>
<xsl:template match="cost">
<p>
<xsl:choose>
<xsl:when test=". > 80.00">
<xsl:attribute name="style">
color:maroon;
</xsl:attribute>
cost: £<xsl:value-of select="." /> (Expensive!)
</xsl:when>
<xsl:when test=". < 79.99">
<xsl:attribute name="style">
color:green;
</xsl:attribute>
cost: £<xsl:value-of select="." /> (Good value!)
</xsl:when>
</xsl:choose>
</p>
</xsl:template>
</xsl:stylesheet>
*******html code*********
<script type="text/javascript">
// Load XML
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("carpstuff.xml")
// Load XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("carpstuff.xsl")
</script>
<title>XML XSLT</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="stylesheet/stylesheet.css" type="text/css">
</head>
<body>
<table width="753" top-margin="10" border="0" cellpadding="0" cellspacing="0" align="center">
<div class="container">
<div><img src="images/topimage.gif"></div>
<div class="myinfo">Greig Bosworth - Interactive Multimedia Student - Wolverhampton University - Student # 0063808</div>
<div><img src="images/leftimage.gif"></div>
<div class="menucontainer">
<div class="menuhead">Menu</div>
<div class="buttonpos">
<div class="buttons1"><a href="index.htm">{ XML }</a></div>
<div class="buttons1"><a href="xml.htm">{ Data Islands }</a></div>
<div class="buttons1"><a href="xslt.htm">{ XSLT }</a></div>
<div class="buttons1"><a href="RSSFeeds.htm">{ RSS Feeds }</a></div>
</div>
</div>
<div class="textcontainer">
<div class="texthead">XML</div>
<div class="maintxt">
<div "maintxtscroll">
<script type="text/javascript">
document.write(xml.transformNode(xsl))
</script>
</div>
</div>
<div class="copyright"><a href="index.htm">Home</a> |<a href="contact.htm">
Contact</a> |<a href="portfolio.htm"> Portfolio </a> </div>
</div>
</div>
© Greig Bosworth 2005
</table>
</body>
</html>
Any help would be greatly appreciated.
Thanx
Greig.......
Display table in CSS via XSLT
