P
Pradeep
I have a following XML file, XSL file and CSS file.
I am facing one problem , that ITEM rows are not displayed in proper
color (RED) as mentioned in css file for .row1...... Same thing works
well if the table is created in <xsl:template match="/"> but doesn't
work for table created in <xsl:template match="ITEMLIST">.
------------------------------------------------------------------------------------------------------
XML file ( name myxml.xml)
------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="myxsl.xsl"?>
<ITEMLIST>
<ITEM>
<NAME> Item1 </NAME>
<PRICE> 500 </PRICE>
<LOCATION> ABC </LOCATION>
</ITEM>
<ITEM>
<NAME> Item2 </NAME>
<PRICE> 600 </PRICE>
<LOCATION> XYZ</LOCATION>
</ITEM>
<ITEM>
<NAME> Item3 </NAME>
<PRICE> 700 </PRICE>
<LOCATION> DEF</LOCATION>
</ITEM>
<ITEM>
<NAME> Item4 </NAME>
<PRICE> 900 </PRICE>
<LOCATION> QWE</LOCATION>
</ITEM>
</ITEMLIST>
------------------------------------------------------------------------------------------------------
XSL file ( name myxsl.xsl)
------------------------------------------------------------------------------------------------------
<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl
utput method="xml" version="1.0" doctype-public="-//W3C//DTD
XHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"/>
<xsl:template match="/">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Data Sheet</title>
<link rel="stylesheet" type="text/css" href="mycss.css" />
</head>
<body>
<table>
<tr>
<th>A</th>
<th>B</th>
</tr>
<tr class="row0">
<td>1</td>
<td>2</td>
</tr>
<tr class="row1">
<td>3</td>
<td>4</td>
</tr>
</table>
<xsl:apply-templates/>
</body>
</html>
</xsl:template>
<xsl:template match="ITEMLIST">
<table>
<tr>
<th>Name</th>
<th>Price</th>
<th>Location</th>
</tr>
<xsl:for-each select="ITEM">
<tr class="row1">
<td><xsl:value-of select="NAME" /></td>
<td><xsl:value-of select="PRICE" /></td>
<td><xsl:value-of select="LOCATION" /></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
------------------------------------------------------------------------------------------------------
CSS file ( name mycss.css)
------------------------------------------------------------------------------------------------------
html body {
line-height:1.55em;
font-family:"Lucida Grande", verdana, lucida, helvetica, sans-serif;
margin:0;
padding:0;
font-size:x-small;
font-size:small;
}
table
{
display: table;
border-collapse:collapse;
empty-cells:show;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
}
tr {
display: table-row;
}
..row0 {
background-color:yellow;
color:#1559B3;
}
..row1 {
background-color:red;
color:#1559B3;
}
td {
display: table-cell;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
}
th {
display: table-cell;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
font-weight: 700;
background-color:#99cccc;
}
If you have any idea about this issue, please do reply....
I am facing one problem , that ITEM rows are not displayed in proper
color (RED) as mentioned in css file for .row1...... Same thing works
well if the table is created in <xsl:template match="/"> but doesn't
work for table created in <xsl:template match="ITEMLIST">.
------------------------------------------------------------------------------------------------------
XML file ( name myxml.xml)
------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="myxsl.xsl"?>
<ITEMLIST>
<ITEM>
<NAME> Item1 </NAME>
<PRICE> 500 </PRICE>
<LOCATION> ABC </LOCATION>
</ITEM>
<ITEM>
<NAME> Item2 </NAME>
<PRICE> 600 </PRICE>
<LOCATION> XYZ</LOCATION>
</ITEM>
<ITEM>
<NAME> Item3 </NAME>
<PRICE> 700 </PRICE>
<LOCATION> DEF</LOCATION>
</ITEM>
<ITEM>
<NAME> Item4 </NAME>
<PRICE> 900 </PRICE>
<LOCATION> QWE</LOCATION>
</ITEM>
</ITEMLIST>
------------------------------------------------------------------------------------------------------
XSL file ( name myxsl.xsl)
------------------------------------------------------------------------------------------------------
<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
version="1.0">
<xsl
utput method="xml" version="1.0" doctype-public="-//W3C//DTDXHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"/>
<xsl:template match="/">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Data Sheet</title>
<link rel="stylesheet" type="text/css" href="mycss.css" />
</head>
<body>
<table>
<tr>
<th>A</th>
<th>B</th>
</tr>
<tr class="row0">
<td>1</td>
<td>2</td>
</tr>
<tr class="row1">
<td>3</td>
<td>4</td>
</tr>
</table>
<xsl:apply-templates/>
</body>
</html>
</xsl:template>
<xsl:template match="ITEMLIST">
<table>
<tr>
<th>Name</th>
<th>Price</th>
<th>Location</th>
</tr>
<xsl:for-each select="ITEM">
<tr class="row1">
<td><xsl:value-of select="NAME" /></td>
<td><xsl:value-of select="PRICE" /></td>
<td><xsl:value-of select="LOCATION" /></td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
------------------------------------------------------------------------------------------------------
CSS file ( name mycss.css)
------------------------------------------------------------------------------------------------------
html body {
line-height:1.55em;
font-family:"Lucida Grande", verdana, lucida, helvetica, sans-serif;
margin:0;
padding:0;
font-size:x-small;
font-size:small;
}
table
{
display: table;
border-collapse:collapse;
empty-cells:show;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
}
tr {
display: table-row;
}
..row0 {
background-color:yellow;
color:#1559B3;
}
..row1 {
background-color:red;
color:#1559B3;
}
td {
display: table-cell;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
}
th {
display: table-cell;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
font-weight: 700;
background-color:#99cccc;
}
If you have any idea about this issue, please do reply....