XML - Putting images into .xsl - css

I have a "blog" made with XML and XLST.
This is the format of the blog:
<post id="1" category="Miscellaneous">
<ptitle>MiG-21</ptitle>
<psubtitle>Mikoyan-Gurevich MiG-21</psubtitle>
<image></image>
<author> Brian Livori </author>
<date> 11/10/2012 </date>
<par> The Mikoyan-Gurevich MiG-21 (Russian: Микоян и Гуревич МиГ-21; NATO reporting name: Fishbed) is a supersonic jet fighter aircraft, designed by the Mikoyan-Gurevich Design Bureau in the Soviet Union. It was popularly nicknamed "balalaika", from the aircraft's planform-view resemblance to the Russian stringed musical instrument or ołówek (English: pencil) by Polish pilots due to the shape of its fuselage.[2]
Early versions are considered second-generation jet fighters, while later versions are considered to be third-generation jet fighters. Some 50 countries over four continents have flown the MiG-21, and it still serves many nations a half-century after its maiden flight. The fighter made aviation records. At least by name, it is the most-produced supersonic jet aircraft in aviation history and the most-produced combat aircraft since the Korean War, and it had the longest production run of a combat aircraft (1959 to 1985 over all variants).
</par>
<source>http://en.wikipedia.org/wiki/Mikoyan-Gurevich_MiG-21</source>
<comments>dsgsdg</comments>
</post>
<post id="2" category="Miscellaneous">
<ptitle>MiG-21</ptitle>
<psubtitle>Mikoyan-Gurevich MiG-21</psubtitle>
<image></image>
<author> Brian Livori </author>
<date> 11/10/2012 </date>
<par> The Mikoyan-Gurevich MiG-21 (Russian: Микоян и Гуревич МиГ-21; NATO reporting name: Fishbed) is a supersonic jet fighter aircraft, designed by the Mikoyan-Gurevich Design Bureau in the Soviet Union. It was popularly nicknamed "balalaika", from the aircraft's planform-view resemblance to the Russian stringed musical instrument or ołówek (English: pencil) by Polish pilots due to the shape of its fuselage.[2]
Early versions are considered second-generation jet fighters, while later versions are considered to be third-generation jet fighters. Some 50 countries over four continents have flown the MiG-21, and it still serves many nations a half-century after its maiden flight. The fighter made aviation records. At least by name, it is the most-produced supersonic jet aircraft in aviation history and the most-produced combat aircraft since the Korean War, and it had the longest production run of a combat aircraft (1959 to 1985 over all variants).
</par>
<source>http://en.wikipedia.org/wiki/Mikoyan-Gurevich_MiG-21</source>
<comments>dsgsdg</comments>
</post>
I would like to insert an image for each blog post.
How can I do this?
This is my .xls file:
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html"/>
<xsl:template match ="/">
<html>
<body>
<table align="center" >
<tr bgcolor="C77838">
<th>Brian's Blog </th>
<th>About</th>
<th>Contact</th>
</tr>
</table>
<table align="center" bgcolor="1D6135">
<tr align="center">
<xsl:element name="img" >
<xsl:attribute name="border">0</xsl:attribute>
<xsl:attribute name="src">images/banner.jpg</xsl:attribute>
<xsl:attribute name="alt">Banner</xsl:attribute>
</xsl:element>
</tr>
<tr align="center">
<h1>JET FIGHTERS</h1>
</tr>
</table>
<br></br><br></br>
<table >
<td width="10%" bgcolor="white"></td>
<td bgcolor="CC9933">
<xsl:for-each select="blog/post">
<tr bgcolor="FFFF99" ><td><xsl:value-of select="ptitle"/></td></tr>
<tr bgcolor="FFFFCC"><td><xsl:value-of select="psubtitle"/></td></tr><br></br><br></br>
<tr bgcolor="FFFFCC"><td><xsl:value-of select="image"/></td></tr>
<tr><td><xsl:value-of select="par"/></td></tr><br></br><br></br>
<tr bgcolor="D6D6B2"><td>Source: <xsl:value-of select="source"/></td></tr>
<br></br><tr bgcolor="FFFFCC">Posted on: <xsl:value-of select="date"/> by <xsl:value-of select="author"/></tr>
<br></br><tr bgcolor="FFFFCD">Comments: <xsl:value-of select="comments"/> by <xsl:value-of select="comments"/></tr>
<hr color="white"></hr>
</xsl:for-each>
</td>
<td width="10%" bgcolor="white"></td>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="list">
Images are element contents, apply a template to all image elements:
<xsl:apply-templates select="image"/>
Images are attribute values of an element, we do it differently:
<xsl:apply-templates select="image3"/>
</xsl:template>
<xsl:template match="image1">
<p> <img src="{#source}"/><br/><xsl:value-of select="."/> </p>
</xsl:template>
</xsl:stylesheet>

Assuming that the images' URLs are going to be contained in the <image> element and that the images should be omitted for <images> that are blank, I believe this is what you're trying to accomplish. Please clarify your question if not:
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html"/>
<xsl:template match ="/">
<html>
<body>
<table align="center" >
<tr bgcolor="C77838">
<th>Brian's Blog </th>
<th>About</th>
<th>Contact</th>
</tr>
</table>
<table align="center" bgcolor="1D6135">
<tr align="center">
<td>
<img border="0" src="images/banner.jpg" alt="Banner" />
</td>
</tr>
<tr align="center">
<td>
<h1>JET FIGHTERS</h1>
</td>
</tr>
</table>
<br />
<br />
<table >
<tr>
<td width="10%" bgcolor="white"></td>
<td bgcolor="CC9933">
<xsl:apply-templates select="blog/post" />
</td>
<td width="10%" bgcolor="white"></td>
</tr>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="post">
<table>
<tr bgcolor="FFFF99" >
<td>
<xsl:value-of select="ptitle"/>
</td>
</tr>
<tr bgcolor="FFFFCC">
<td>
<xsl:value-of select="psubtitle"/>
</td>
</tr>
<br></br>
<br></br>
<xsl:if test="normalize-space(image)">
<tr bgcolor="FFFFCC">
<td>
<xsl:apply-templates select="image"/>
</td>
</tr>
</xsl:if>
<tr>
<td>
<xsl:value-of select="par"/>
</td>
</tr>
<br />
<br />
<tr bgcolor="D6D6B2">
<td>
Source: <xsl:value-of select="source"/>
</td>
</tr>
<br></br>
<tr bgcolor="FFFFCC">
<td>
Posted on: <xsl:value-of select="date"/> by <xsl:value-of select="author"/>
</td>
</tr>
<br></br>
<tr bgcolor="FFFFCD">
<td>
Comments: <xsl:value-of select="comments"/> by <xsl:value-of select="comments"/>
</td>
</tr>
<hr color="white" />
</table>
</xsl:template>
<xsl:template match="image">
<p>
<img src="{.}"/>
<br/>
<xsl:value-of select="."/>
</p>
</xsl:template>
</xsl:stylesheet>
There are a lot of problems with your HTML. I cleaned up what I could, but there's a lot more to fix. You shouldn't be using tables for layout, but if you must do so, at the very least, you should not have <br/ >s and <hr />s directly below a table element, <td>s must be directly under <tr>s, and <tr>s must be directly below <table>s.

Related

creating beams of variable length with xslt

From the following xml data:
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet href="kandidaten.xsl" type="text/xsl"?>
<auswertung>
<kandidat>
<name>Peter</name>
<punkte>67</punkte>
</kandidat>
<kandidat>
<name>Karl</name>
<punkte>87</punkte>
</kandidat>
<kandidat>
<name>Anita</name>
<punkte>36</punkte>
</kandidat>
<kandidat>
<name>Rosi</name>
<punkte>67</punkte>
</kandidat>
<kandidat>
<name>Heiner</name>
<punkte>50</punkte>
</kandidat>
<kandidat>
<name>Paul</name>
<punkte>45</punkte>
</kandidat>
</auswertung>
I want to create the following output with xslt:
To this end I wrote the following xslt code:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
exclude-result-prefixes="xs"
version="2.0">
<xsl:template match="auswertung">
<html>
<head>
<title>Kandidaten</title>
</head>
<body>
<h1>Kandidaten und ihre Punkte</h1>
<hr/>
<table>
<xsl:apply-templates select="kandidat">
<xsl:sort select="punkte" order="descending"></xsl:sort>
</xsl:apply-templates>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="kandidat">
<tr>
<td>
<xsl:value-of select="name/text()"/>
</td>
<!-- second columns of table is supposed to contain the -->
<!-- points ("punkte") of the respective candidate ("kandidat") -->
<td>
<!-- second column contains a paragraph whose background-color is blue -->
<p bgcolor="#0000ff">
<xsl:call-template name="create_empty_space">
<xsl:with-param name="count" select="punkte/text()"/>
<xsl:with-param name="number" select="punkte/text()"/>
</xsl:call-template>
</p>
</td>
</tr>
</xsl:template>
<xsl:template name="create_empty_space">
<xsl:param name="count"/>
<xsl:param name="number"/>
<!-- print number (points achieved by candidate) in the middle of the beam -->
<xsl:if test="$count = round($number div 2)">
<font color="#ffff00">
<xsl:value-of select="$number"/>
</font>
</xsl:if>
<xsl:if test="$count > 0">
<!-- amount of empty space created is supposed to depend on the number of -->
<!--points, therefore function "create_empty_space" is called recursively-->
<!-- depending on the number of points -->
<!--... example: if points==20, function is called 20 times -->
<xsl:text> </xsl:text>
<xsl:call-template name="create_empty_space">
<xsl:with-param name="count" select="$count - 1"/>
<xsl:with-param name="number" select="$number"/>
</xsl:call-template>
</xsl:if>
</xsl:template>
</xsl:stylesheet>
When I run the code, all beams have the same size, though.
How can I make the length of the beams correspond to the number of points of the respective candidate?
Since you're using xml-stylesheet in your XML input, I doubt you're really using a 2.0 processor.
Like Martin suggested, the first items width should be 100% and the width of the remaining items should be computed based on the first (max).
Here's a modified version of your XSLT...
XSLT 1.0
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:strip-space elements="*"/>
<!--This is easier in XSLT 2.0:
<xsl:variable name="maxPoints" select="max(/*/kandidat/punkte)"/>
-->
<xsl:variable name="maxPoints">
<xsl:for-each select="/*/kandidat">
<xsl:sort select="punkte" order="descending"/>
<xsl:if test="position() = 1">
<xsl:value-of select="punkte"/>
</xsl:if>
</xsl:for-each>
</xsl:variable>
<xsl:template match="auswertung">
<html>
<head>
<title>Kandidaten</title>
</head>
<body>
<h1>Kandidaten und ihre Punkte</h1>
<hr/>
<table style="width: 100%">
<xsl:apply-templates select="kandidat">
<xsl:sort select="punkte" order="descending"/>
</xsl:apply-templates>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="kandidat">
<tr>
<td style="width: 1%">
<xsl:value-of select="name"/>
</td>
<!-- second columns of table is supposed to contain the -->
<!-- points ("punkte") of the respective candidate ("kandidat") -->
<td>
<!-- second column contains a paragraph whose background-color is blue -->
<div style="text-align: center;width: {round(punkte div $maxPoints * 100)}%;color: #ffff00;background-color: #0000ff;">
<xsl:value-of select="punkte"/>
</div>
</td>
</tr>
</xsl:template>
</xsl:stylesheet>
Output
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Kandidaten</title>
</head>
<body>
<h1>Kandidaten und ihre Punkte</h1>
<hr>
<table style="width: 100%">
<tr>
<td style="width: 1%">Karl</td>
<td>
<div style="text-align: center;width: 100%;color: #ffff00;background-color: #0000ff;">87</div>
</td>
</tr>
<tr>
<td style="width: 1%">Peter</td>
<td>
<div style="text-align: center;width: 77%;color: #ffff00;background-color: #0000ff;">67</div>
</td>
</tr>
<tr>
<td style="width: 1%">Rosi</td>
<td>
<div style="text-align: center;width: 77%;color: #ffff00;background-color: #0000ff;">67</div>
</td>
</tr>
<tr>
<td style="width: 1%">Heiner</td>
<td>
<div style="text-align: center;width: 57%;color: #ffff00;background-color: #0000ff;">50</div>
</td>
</tr>
<tr>
<td style="width: 1%">Paul</td>
<td>
<div style="text-align: center;width: 52%;color: #ffff00;background-color: #0000ff;">45</div>
</td>
</tr>
<tr>
<td style="width: 1%">Anita</td>
<td>
<div style="text-align: center;width: 41%;color: #ffff00;background-color: #0000ff;">36</div>
</td>
</tr>
</table>
</body>
</html>
EDIT: You could also clean up your stylesheet and output a little by using CSS classes...
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:strip-space elements="*"/>
<!--This is easier in XSLT 2.0:
<xsl:variable name="maxPoints" select="max(/*/kandidat/punkte)"/>
-->
<xsl:variable name="maxPoints">
<xsl:for-each select="/*/kandidat">
<xsl:sort select="punkte" order="descending"/>
<xsl:if test="position() = 1">
<xsl:value-of select="punkte"/>
</xsl:if>
</xsl:for-each>
</xsl:variable>
<xsl:template match="auswertung">
<html>
<head>
<title>Kandidaten</title>
<style type="text/css">
.name {
width: 10%;
}
.punkte {
text-align: center;
color: #ffff00;
background-color: #0000ff;
}
table.kandidat {
width: 100%;
}
</style>
</head>
<body>
<h1>Kandidaten und ihre Punkte</h1>
<hr/>
<table class="kandidat">
<xsl:apply-templates select="kandidat">
<xsl:sort select="punkte" order="descending"/>
</xsl:apply-templates>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="kandidat">
<tr>
<td class="name">
<xsl:value-of select="name"/>
</td>
<td>
<div style="width: {round(punkte div $maxPoints * 100)}%;"
class="punkte">
<xsl:value-of select="punkte"/>
</div>
</td>
</tr>
</xsl:template>

XSLT stylesheet detects table elements but doesn't show them

I want to output the names, domain and usage of a database where its version is equal to 20i. I have created a stylesheet that does this - when I load my xml, it detects that I have an element matching my requirements in the table, but doesn't actually show them. No idea what I'm doing wrong!
XML:
<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/xsl" href="xrt.xsl"?>
<Inventory>
<DatabaseName>
<GlobalName>Tom</GlobalName>
<Function>production</Function>
<Domain>tom.info</Domain>
<Administrator EmailAlias="xrichards" Extension="221">Xavier Richards</Administrator>
<Attributes Type="Production" Version="20ix"/>
<Comments>
...
</Comments>
<Usage>
500
</Usage>
</DatabaseName>
<DatabaseName>
<GlobalName>Ricardo</GlobalName>
<Function>production</Function>
<Domain>tom.info</Domain>
<Administrator EmailAlias="xrichards" Extension="221">Xavier Richards</Administrator>
<Attributes Type="Production" Version="20i"/>
<Comments>
...
</Comments>
<Usage>
500
</Usage>
</DatabaseName>
<WebserverName>
<GlobalName>Jim</GlobalName>
<Function>distribution</Function>
<Domain>jim1235.com</Domain>
<Administrator EmailAlias="rkarvani" Extension="134237">Richard Karvani</Administrator>
<Administrator EmailAlias="stones" Extension="222237">Steve Jones</Administrator>
<Attributes Type="Production" Version="20i"/>
<Comments>
...
</Comments>
<Usage>
1200
</Usage>
</WebserverName>
</Inventory>
XSLT Document:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h1>My Server List</h1>
<h2>Database Servers</h2>
<xsl:apply-templates select="Inventory/DatabaseName" />
<h2>Webservers</h2>
<xsl:apply-templates select="Inventory/WebserverName" />
</body>
</html>
</xsl:template>
<xsl:template match="DatabaseName">
<table border="1">
<tr>
<th>Name</th>
<th>Domain</th>
<th>Usage</th>
</tr>
<xsl:for-each select="Attributes[#Version='20i']">
<tr>
<td><xsl:value-of select="GlobalName"/></td>
<td><xsl:value-of select="Domain"/></td>
<td><xsl:value-of select="Usage"/></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
<xsl:template match="WebserverName">
<table border="1">
<tr>
<th>Name</th>
<th>Domain</th>
<th>Usage</th>
</tr>
<xsl:for-each select="Attributes[#Version='20i']">
<tr>
<td><xsl:value-of select="GlobalName"/></td>
<td><xsl:value-of select="Domain"/></td>
<td><xsl:value-of select="Usage"/></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
I think you want to put the condition about that version into the apply-templates and move the table creation to the another template:
<?xml version="1.0" encoding="UTF-8" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h1>My Server List</h1>
<h2>Database Servers</h2>
<table border="1">
<tr>
<th>Name</th>
<th>Domain</th>
<th>Usage</th>
</tr>
<xsl:apply-templates select="Inventory/DatabaseName[Attributes[#Version='20i']]" />
</table>
<h2>Webservers</h2>
<table border="1">
<tr>
<th>Name</th>
<th>Domain</th>
<th>Usage</th>
</tr>
<xsl:apply-templates select="Inventory/WebserverName[Attributes[#Version='20i']]" />
</table>
</body>
</html>
</xsl:template>
<xsl:template match="DatabaseName">
<tr>
<td><xsl:value-of select="GlobalName"/></td>
<td><xsl:value-of select="Domain"/></td>
<td><xsl:value-of select="Usage"/></td>
</tr>
</xsl:template>
<xsl:template match="WebserverName">
<tr>
<td><xsl:value-of select="GlobalName"/></td>
<td><xsl:value-of select="Domain"/></td>
<td><xsl:value-of select="Usage"/></td>
</tr>
</xsl:template>
</xsl:stylesheet>

xslt with xml control in asp.net

my xml file name is product_file.xml and i have an xslt file , i am using a xml control in my webpage by binding xml & xslt files to the control but i am not getting the output properly. It showing only header multiple times
<?xml version="1.0" encoding="utf-8" ?>
<productlist>
<product>
<itemnumber>1</itemnumber>
<name>Staple Superior Men’s Jacket</name>
<description>The Staple Superior T-bone PU Jacket is classic hood with a drawstring fastening, long and a zip up front fastening.</description>
<color>BLACK</color>
<image>Staplesuperior1.gif</image>
<price>$140</price>
<size>69</size>
<quantity>1</quantity>
<category>Men</category>
</product>
<product>
<itemnumber>2</itemnumber>
<name>Afends Mens t-shirt</name>
<description>The Afends Thrash For Cash Raglan Tee has a scooped hemline, a 100% cotton composition, and a regular fit.</description>
<color>Beach Heather & Black</color>
<image>Afends1.gif</image>
<price>$90</price>
<size>80</size>
<quantity>1</quantity>
<category>Men</category>
</product>
<product>
<itemnumber>3</itemnumber>
<name>Wrangler Men Blue Vegas Skinny Fit Jeans</name>
<description>Blue 5 pocket jeans, stretchable, has a zip fly with buttoned closure in front, 2 scoop pockets at sides</description>
<image>Wrangler1.gif</image>
<color>BLUE</color>
<price>$125</price>
<size>32</size>
<quantity>1</quantity>
<category>Men</category>
</product>
<product>
<itemnumber>4</itemnumber>
<name>Roadster Women Top</name>
<description>Black top, knit, V neck, short extended sleeves, lattice like fabric manipulation detail at shoulders</description>
<color>BLACK</color>
<image>Roadster.gif</image>
<price>$55</price>
<size>Small</size>
<quantity>1</quantity>
<category>Women</category>
</product>
and my xslt file is
<xsl:template match="product">
<html>
<head>
<title>Products XSLT Demo</title>
</head>
<body>
<h2>Products Information</h2>
<br/>
<!--<xsl:copy>
<xsl:apply-templates select="#* | node()"/>
</xsl:copy>-->
<table bgcolor="#008BE7" border="1">
<xsl:for-each select="itemnumber">
<tr>
<td>Item Number</td>
<td>
<xsl:value-of select="itemnumber"/>
</td>
</tr>
<tr> <td>name</td>
<td>
<xsl:value-of select="name"/>
</td>
</tr>
<tr>
<td>description</td>
<td>
<xsl:value-of select="description"/>
</td>
</tr>
<tr>
<td>color</td>
<td>
<xsl:value-of select="color"/>
</td>
</tr>
<tr>
<td>price</td>
<td>
<xsl:value-of select="price"/>
</td>
</tr>
<tr>
<td>size</td>
<td>
<xsl:value-of select="size"/>
</td>
</tr>
<tr> <td>quantity</td>
<td>
<xsl:value-of select="quantity"/>
</td>
</tr>
<tr>
<td>category</td>
<td>
<xsl:value-of select="category"/>
</td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
now the error is the foreach expression not working so the ouput showing only heading multiple times
This seems to be working for me. changing the templatematch to productlist and foreach to product
<xsl:template match="productlist">
<html>
<head>
<title>Products XSLT Demo</title>
</head>
<body>
<h2>Products Information</h2>
<br/>
<!--<xsl:copy>
<xsl:apply-templates select="#* | node()"/>
</xsl:copy>-->
<table bgcolor="#008BE7" border="1">
<xsl:for-each select="product">
<tr>
<td>Item Number</td>
<td>
<xsl:value-of select="itemnumber"/>
</td>
</tr>
<tr> <td>name</td>
<td>
<xsl:value-of select="name"/>
</td>
</tr>
<tr>
<td>description</td>
<td>
<xsl:value-of select="description"/>
</td>
</tr>
<tr>
<td>color</td>
<td>
<xsl:value-of select="color"/>
</td>
</tr>
<tr>
<td>price</td>
<td>
<xsl:value-of select="price"/>
</td>
</tr>
<tr>
<td>size</td>
<td>
<xsl:value-of select="size"/>
</td>
</tr>
<tr> <td>quantity</td>
<td>
<xsl:value-of select="quantity"/>
</td>
</tr>
<tr>
<td>category</td>
<td>
<xsl:value-of select="category"/>
</td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
Change the foreach to
<xsl:for-each select=".">

Transforming xml into a multicolumn html table

I would like to have the following XML:
<?xml version="1.0" standalone="yes"?>
<NewDataSet>
<categories>
<name>Badges & Holders</name>
<value>1000111</value>
</categories>
<categories>
<name>Clips, Tacks & Rubber Bands</name>
<value>1000113</value>
</categories>
<categories>
<name>Clocks</name>
<value>1000114</value>
</categories>
<categories>
<name>Indexing Flags & Tabs</name>
<value>1000115</value>
</categories>
<categories>
<name>Magnification</name>
<value>1000116</value>
</categories>
<categories>
<name>Pad Holders</name>
<value>1000117</value>
</categories>
<categories>
<name>Paper Punch Accessories</name>
<value>1000118</value>
</categories>
<categories>
<name>Paper Punches</name>
<value>1000119</value>
</categories>
<categories>
<name>Scissors, Rulers & Paper Trimmers</name>
<value>1000120</value>
</categories>
<categories>
<name>Signs & Nameplates</name>
<value>1000121</value>
</categories>
<categories>
<name>Stamps & Pads Accessories</name>
<value>1000122</value>
</categories>
<categories>
<name>Stapler Accessories</name>
<value>1000123</value>
</categories>
<categories>
<name>Staplers</name>
<value>1000124</value>
</categories>
<categories>
<name>Tags & Tickets</name>
<value>1000125</value>
</categories>
<categories>
<name>Tape, Glue & Adhesives</name>
<value>1000126</value>
</categories>
</NewDataSet>
And turn it into HTML (table) like this:
<table>
<tr>
<td>
<div>
<img src="Path/" + {value} + ".jpg"></img>
</div>
<div>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name"/>
</span>
</div>
</td>
</tr>
</table>
Here is the kicker, though. I only need it to have 5 columns of TD's and then start over with a new TR after that.. all the way down. If it has, say, 12 items in the XML, then I need it to go ahead and have 15 TD's (I presume) so that the table is a nice square.
In the future we will have a "PictureURL" or something like that in this XML for each "categories" item just like the name and value. I could get that working later on my own, I bet, if I can get this working now.
Thank you very much for any help! The XSLT syntax has me still confused after a few days of trying this and googling around.
Here is what I have been trying to make work and could not pull it off:
<table>
<xsl:for-each select="categories[position() mod 5 = 1]">
<xsl:variable name="pos" select="position() - 1" />
<tr>
<td >
<xsl:value-of select="."/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name[position() = ($pos * 5)]"/>
</span>
</td>
<td>
<xsl:value-of select="//categories[position() = ($pos * 5) + 2]"/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name[position() = ($pos * 5) + 2]"/>
</span>
</td>
<td>
<xsl:value-of select="//categories[position() = ($pos * 5) + 3]"/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name[position() = ($pos * 5) + 3]"/>
</span>
</td>
<td>
<xsl:value-of select="//categories[position() = ($pos * 5) + 4]"/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name[position() = ($pos * 5) + 4]"/>
</span>
</td>
<td>
<xsl:value-of select="//categories[position() = ($pos * 5) + 5]"/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name[position() = ($pos * 5) + 5]"/>
</span>
</td>
</tr>
</xsl:for-each>
</table>
This is how I tried to integrate JLRishe's answer into my existing XSLT:
<!--================-->
<!-- Categories -->
<!--================-->
<xsl:template name="WriteCategories">
<xsl:if test="categories">
<div>
<!-- set the class, if browsing it's a larger font -->
<xsl:choose>
<xsl:when test="$pBrowse='True'">
<xsl:attribute name="class">critGroup lg</xsl:attribute>
</xsl:when>
<xsl:otherwise>
<xsl:attribute name="class">critGroup</xsl:attribute>
</xsl:otherwise>
</xsl:choose>
<xsl:variable name="numCols" select="5" />
<xsl:template match="/*">
<table>
<xsl:apply-templates select="categories[position() mod $numCols = 1]"
mode="row" />
</table>
</xsl:template>
<xsl:template match="categories" mode="row">
<tr>
<xsl:variable name="thisRowItems"
select=". | following-sibling::categories[position() < $numCols]" />
<xsl:apply-templates select="$thisRowItems" />
<xsl:call-template name="addCells">
<xsl:with-param name="count" select="$numCols - count($thisRowItems)" />
</xsl:call-template>
</tr>
</xsl:template>
<xsl:template match="categories">
<td>
<xsl:value-of select="."/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name" />
</span>
</td>
</xsl:template>
<xsl:template name="addCells">
<xsl:param name="count" />
<xsl:if test="$count > 0">
<td></td>
<xsl:call-template name="addCells">
<xsl:with-param name="count" select="$count - 1" />
</xsl:call-template>
</xsl:if>
</xsl:template>
<div>
<!-- if not browsing, write expandable area if there are more than 5 items -->
<xsl:if test="$pBrowse='False' and count(categories)>5">
<div id="divCritHdnMore_Category" class="moreHidden">
<xsl:for-each select="categories">
<xsl:if test="position()>5">
<div>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name" disable-output-escaping="yes" />
</span>
<xsl:value-of select="concat(' (', count, ')')" />
</div>
</xsl:if>
</xsl:for-each>
</div>
</xsl:if>
</div>
<!-- more link -->
<xsl:if test="$pBrowse='False' and count(categories)>5">
<div class="moreLink">
<span id="spnCritMore_Category" onclick="CriteriaMore('Category')">More . . .</span>
</div>
</xsl:if>
</div>
</xsl:if>
</xsl:template>
This is how you can do table row grouping. I don't think having the right number of <td>s in the last row is strictly necessary, but I've added that capability too:
Add this to your WriteCategories template in the place where you want the table to be:
<table>
<xsl:apply-templates select="categories[position() mod $numCols = 1]"
mode="row" />
</table>
And add this outside of any other templates:
<xsl:variable name="numCols" select="5" />
<xsl:template match="categories" mode="row">
<tr>
<xsl:variable name="thisRowItems"
select=". | following-sibling::categories
[position() < $numCols]" />
<xsl:apply-templates select="$thisRowItems" />
<xsl:call-template name="addCells">
<xsl:with-param name="count" select="$numCols - count($thisRowItems)" />
</xsl:call-template>
</tr>
</xsl:template>
<xsl:template match="categories">
<td>
<xsl:value-of select="."/>
<span onclick="Critia(this, '{value}')">
<xsl:value-of select="name" />
</span>
</td>
</xsl:template>
<xsl:template name="addCells">
<xsl:param name="count" />
<xsl:if test="$count > 0">
<td></td>
<xsl:call-template name="addCells">
<xsl:with-param name="count" select="$count - 1" />
</xsl:call-template>
</xsl:if>
</xsl:template>
When run on your sample input with the last 3 categories removed to make 12 items, the result is:
<table>
<tr>
<td>
Badges & Holders
1000111
<span onclick="Critia(this, '1000111')">Badges & Holders</span></td>
<td>
Clips, Tacks & Rubber Bands
1000113
<span onclick="Critia(this, '1000113')">Clips, Tacks & Rubber Bands</span></td>
<td>
Clocks
1000114
<span onclick="Critia(this, '1000114')">Clocks</span></td>
<td>
Indexing Flags & Tabs
1000115
<span onclick="Critia(this, '1000115')">Indexing Flags & Tabs</span></td>
<td>
Magnification
1000116
<span onclick="Critia(this, '1000116')">Magnification</span></td>
</tr>
<tr>
<td>
Pad Holders
1000117
<span onclick="Critia(this, '1000117')">Pad Holders</span></td>
<td>
Paper Punch Accessories
1000118
<span onclick="Critia(this, '1000118')">Paper Punch Accessories</span></td>
<td>
Paper Punches
1000119
<span onclick="Critia(this, '1000119')">Paper Punches</span></td>
<td>
Scissors, Rulers & Paper Trimmers
1000120
<span onclick="Critia(this, '1000120')">Scissors, Rulers & Paper Trimmers</span></td>
<td>
Signs & Nameplates
1000121
<span onclick="Critia(this, '1000121')">Signs & Nameplates</span></td>
</tr>
<tr>
<td>
Stamps & Pads Accessories
1000122
<span onclick="Critia(this, '1000122')">Stamps & Pads Accessories</span></td>
<td>
Stapler Accessories
1000123
<span onclick="Critia(this, '1000123')">Stapler Accessories</span></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>

Using XSLT/XML to generate styles for HTML tags? (xsl:attribute-set)

Okay, it's been a tough hour or so... I'm having difficulties generating table cells with different widths. I'm using XML/XSLT to spit out my HTML, so basically the widths are stored in XML format:
<size>
<width1>5</width1>
<width2>4</width2>
<width3>7</width3>
</size>
Using XSLT's attribute-set I should have a table row and cells with 5px, 4px, 7px widths respectively. However, the trouble with this is that attribute-set needs to be a child of <xsl:stylesheet> for it to work. I CAN'T do this: (forgive the missing px)
<tr>
<td>
<xsl:attribute-set name="style">
<xsl:attribute name="width"><xsl:value-of select="size/width1"/></xsl:attribute>
</xsl:attribute-set>
</td>
<td>
<xsl:attribute-set name="style">
<xsl:attribute name="width"><xsl:value-of select="size/width2"/></xsl:attribute>
</xsl:attribute-set>
</td>
<td>
<xsl:attribute-set name="style">
<xsl:attribute name="width"><xsl:value-of select="size/width3"/></xsl:attribute>
</xsl:attribute-set>
</td>
</tr>
Is there any way to generate html tag using XML data to style them?
Instead of xsl:attribute-set you need to add an xsl:attribute inside your <td> element:
<xsl:template match="size">
<tr>
<td>
<xsl:attribute name="width">
<xsl:value-of select="./width1"/>
</xsl:attribute>
</td>
<td>
<xsl:attribute name="width">
<xsl:value-of select="./width2"/>
</xsl:attribute>
</td>
<td>
<xsl:attribute name="width">
<xsl:value-of select="./width3"/>
</xsl:attribute>
</td>
</tr>
</xsl:template>
More XSLT style:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="yes"/>
<xsl:template match="size">
<table>
<tr>
<xsl:apply-templates/>
</tr>
</table>
</xsl:template>
<xsl:template match="size/*">
<td style="width:{.}px;">
<!-- Do stuff -->
</td>
</xsl:template>
</xsl:stylesheet>
Applied to your sample result will be:
<table>
<tr>
<td style="width:5px;"></td>
<td style="width:4px;"></td>
<td style="width:7px;"></td>
</tr>
</table>

Resources