XSLT Syntax

Let’s take an example to take a sample XML file and transform it into a well formatted HTML document.

See this example:

Create an XML file named employee.xml, having the following code:

Employee.xml

 <?xml version = “1.0”?> <class>     <employee id = “001”>       <firstname>Aryan</firstname>        <lastname>Gupta</lastname>        <nickname>Raju</nickname>        <salary>30000</salary>    </employee>     <employee id = “024”>        <firstname>Sara</firstname>        <lastname>Khan</lastname>        <nickname>Zoya</nickname>        <salary>25000</salary>    </employee>     <employee id = “056”>        <firstname>Peter</firstname>        <lastname>Symon</lastname>        <nickname>John</nickname>        <salary>10000</salary>     </employee>  </class> 

Define an XSLT stylesheet document for the above XML document. You should follow the criteria give below:

Page should have a title employee.
Page should have a table of employee’s details.
Columns should have following headers: id, First Name, Last Name, Nick Name, Salary
Table must contain details of the employees accordingly.

Step1: Create XSLT document

Create the XSLT document which satisfies the above requirements. Name it as employee.xsl and save it in the same location of employee.xml.

Employee.xsl

 <?xml version = “1.0” encoding = “UTF-8”?> <!– xsl stylesheet declaration with xsl namespace:  Namespace tells the xlst processor about which  element is to be processed and which is used for output purpose only  –>  <xsl:stylesheet version = “1.0”  xmlns:xsl = “http://www.w3.org/1999/XSL/Transform”>    <!– xsl template declaration:   template tells the xlst processor about the section of xml  document which is to be formatted. It takes an XPath expression.  In our case, it is matching document root element and will  tell processor to process the entire document with this template.  –>     <xsl:template match = “/”>        <!– HTML tags           Used for formatting purpose. Processor will skip them and browser              will simply render them.        –>        <html>           <body>             <h2>Employee</h2>              <table border = “1”>                 <tr bgcolor = “#9acd32″>                    <th>ID</th>                    <th>First Name</th>                    <th>Last Name</th>                    <th>Nick Name</th>                    <th>Salary</th>                 </tr>                 <!– for-each processing instruction                 Looks for each element matching the XPath expression                 –>                <xsl:for-each select=”class/employee”>                    <tr>                       <td>                          <!– value-of processing instruction                          process the value of the element matching the XPath expression                          –>                          <xsl:value-of select = “@id”/>                       </td>                       <td><xsl:value-of select = “firstname”/></td>                       <td><xsl:value-of select = “lastname”/></td>                       <td><xsl:value-of select = “nickname”/></td>                       <td><xsl:value-of select = “salary”/></td>                      </tr>                 </xsl:for-each>              </table>           </body>        </html>     </xsl:template>   </xsl:stylesheet> 

Step2: List the XSLT document to the XML document

Update employee.xml document with the following xml-stylesheet tag. Set href value to employee.xsl

 <?xml version = “1.0”?>  <?xml-stylesheet type = “text/xsl” href=”../employee.xsl”?>  <class>  …  </class> 

Updated “employee.xml”

 <?xml version = “1.0”?> <?xml-stylesheet type = “text/xsl” href=”../employee.xsl”?>  <class>     <employee id = “001”>       <firstname>Aryan</firstname>        <lastname>Gupta</lastname>        <nickname>Raju</nickname>        <salary>30000</salary>    </employee>     <employee id = “024”>        <firstname>Sara</firstname>        <lastname>Khan</lastname>        <nickname>Zoya</nickname>        <salary>25000</salary>    </employee>     <employee id = “056”>        <firstname>Peter</firstname>        <lastname>Symon</lastname>        <nickname>John</nickname>        <salary>10000</salary>     </employee>  </class> 

Step3: View the XML document in Internet Explorer

The output will look like this:

Output:

XSLT Syntax 1

Next TopicXSLT <value-of>

XSLT Syntax

XSLT Syntax

HTML vs XML

YII Upgradation

You may also like