Introduction
XSLT is used for the transformation of XML documents into XHTML. We know that HTML uses predefined set of tags which can be interpreted by the browser. However this is not true for XML documents. XML does not use predefined set of tags. Hence, if we open an XML document in browser we cant expect the browser to display the document in some meaningful format.
This is where XSLT comes into picture. Using XSLT we can define rules for each XML element in the XML document. Those rules decide how to display the corresponding XML element. XSLT does a transformation of each XML element into a HTML element. With XSLT we can not only display the XML elements in a meaningful way but also filters the elements, sort the elements. XSLT can be compared with Cascading Style Sheets (CSS). CSS defines the formating rules for HTML tags, XSLT defines the formatting rules for XML tags.
We will be using the following XML document to understand the basic of XSLT :
File Name : employees.xml
<?xml version="1.0" encoding="ISO-8859-1"?> <employees> <employee vertical="banking"> <id>17452</id> <name>Jason</name> <experience>2</experience> <salary>35000</salary> </employee> <employee vertical="insurance"> <id>14782</id> <name>Jim</name> <experience>3</experience> <salary>45000</salary> </employee> <employee vertical="telecom"> <id>12563</id> <name>Charles</name> <experience>4</experience> <salary>55000</salary> </employee> </employees>
Link the XSL Style Sheet to the XML Document
To apply XSLT formatting to the XML document we need to tell the XML document about the XSLT. We can do this by adding the following line to the XML document :
Creating XSLT documents
The root element
As with XML every XSLT document must also start with a root element. The root element should be or .
For E.g :
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> or <xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
By adding the XSLT namespace attribute, xmlns:xsl, access is provided to elements, attributes.
The value of xmlns:xsl points to the official W3C XSLT namespace. We must also include the atribute version.
Defining templates
In XSLT we can define templates. Templates define a set of rules for nodes. These rules produce a desired display for a node on which the template is applied. In XSLT templates can be defined using xsl:template element.
xsl:template element has a match attribute which associates a template with an XML element.
With the match element we can also associate a template with the entire document.
For E.g :
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<table border="1">
<tr bgcolor="#9acd32">
<th>Id</th>
<th>Name</th>
</tr>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
| Id | Name |
|---|
Explanation:
This is just a trivial example where we dont do much expect creating two headers. In the example above the xsl:template element associates the template to the root element. This is achieved by using match=”/”. This essesntially says if the xml root element is encountered then apply this template. Inside the template we define some HTML to display.
Extracting values of XML elements
We can extract the values of XML elements using the xsl:value-of element.
For E.g:
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<table border="1">
<tr bgcolor="#9acd32">
<th>Id</th>
<th>Name</th>
</tr>
<tr>
<td><xsl:value-of select="employees/employee/id"/></td>
<td><xsl:value-of select="employees/employee/name"/></td>
</tr>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
| Id | Name |
|---|---|
| 17452 | Jason |
Explanation:
This example does nothing much than just displaying the values of the first id and the name element encountered in the xml document. It skips the rest of id and the name elements. We can print all the missing elements using which we will see in the next section.
Select every XML element
The element allows us to perform iterations in the XML document.
For E.g :
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<table border="1">
<tr bgcolor="#9acd32">
<th>Id</th>
<th>Name</th>
</tr>
<xsl:for-each select="employees/employee">
<tr>
<td><xsl:value-of select="id"/></td>
<td><xsl:value-of select="name"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
| Id | Name |
|---|---|
| 17452 | Jason |
| 14782 | Jim |
| 12563 | Charles |
Explanation:
In the example we can see that each of the element is iterated over and the values of the corresponding id and name elements are printed
Filtering the content
We can filter the result generated by XSLT. Using filtering we can display certain content and not display others.
For E.g :
Sorting the output
We can sort the output generated by XSLT by using the element.
For E.g:
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <table border="1"> <tr bgcolor="#9acd32"> <th>Id</th> <th>Name</th> </tr> <xsl:for-each select="employees/employee"> <xsl:sort select="name"/> <tr> <td><xsl:value-of select="id"/></td> <td><xsl:value-of select="name"/></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>
Output:
| Id | Name |
|---|---|
| 12563 | Charles |
| 17452 | Jason |
| 14782 | Jim |
Conditional test
To test for certain condition on the content generated by XSLT we can use element.
For E.g :
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<table border="1">
<tr bgcolor="#9acd32">
<th>Id</th>
<th>Name</th>
</tr>
<xsl:for-each select="employees/employee">
<xsl:if test="salary > 45000">
<tr>
<td><xsl:value-of select="id"/></td>
<td><xsl:value-of select="name"/></td>
</tr>
</xsl:if>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:
| Id | Name |
|---|---|
| 12563 | Charles |
Multiple conditional tests
XSLT does not provides an If-else construct which is normally available in programming languages. However we can test for multiple conditions using a similar sort of a construct called
Consider the following E.g:
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <table border="1"> <tr bgcolor="#9acd32"> <th>Id</th> <th>Name</th> </tr> <xsl:for-each select="employees/employee"> <xsl:choose> <xsl:when test="salary > 45000"> <tr bgcolor="#F00E0E"> <td><xsl:value-of select="id"/></td> <td><xsl:value-of select="name"/></td> </tr> </xsl:when> <xsl:otherwise> <tr bgcolor="#235CDB"> <td><xsl:value-of select="id"/></td> <td><xsl:value-of select="name"/></td> </tr> </xsl:otherwise> </xsl:choose> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>
Output:
| Id | Name |
|---|---|
| 17452 | Jason |
| 14782 | Jim |
| 12563 | Charles |
Explanation:
The example above explains the usage of element. Here we display employee rows in different colors based on a salary range
Apply Templates
We can apply a template to either of these :
– The root
– The current element
– The children of the current element
We can apply templates by using the element. The takes an attribute called select. If we add a select attribute, it tells XSLT processor to apply the template to the children of the element which matches the value of the select attribute. Lets look at an example :
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <xsl:apply-templates/> </body> </html> </xsl:template> <xsl:template match="employee"> <xsl:apply-templates select="name"/> <xsl:apply-templates select="salary"/> </xsl:template><xsl:template match="name"> Name: <span style="color:#ff0000"> <xsl:value-of select="."/></span> <br /> </xsl:template><xsl:template match="salary"> Salary: <span style="color:#00ff00"> <xsl:value-of select="."/></span> <br /> </xsl:template> </xsl:stylesheet>
Output:
Name:Jason
Salary:35000
Name:Jason
Salary:35000
Name:Jason
Salary:35000
Explanation:
The xsl:apply-templates in between the body tags declares that the template should be applied to the entire document.
When an employee element is encountered the matched template is executed. However, inside the employee template we instruct the XSLT processor to apply template to matching name element and salary element. In the matched template we define the rules to display the current element.
[Note: select=”.” refers to the current node]
also read:
How to use XLink and XPointer?