EditiX XSLT Tutorial

v1.0

Your XML document has no usage for a person using for instance a web browser . For showing it, it is required to transform it with XSLT. XSLT is an XML based language containing some instructions to transform your XML document element to another XML document like XHTML/HTML (it is possible to do much more, but this document focuses on standard usage). XSLT is based on a query language called XPath. This query will help you to navigate in your XML document for extracting some data to be shown.

For more information about XSLT, please look at the W3C site : http://www.w3c.org

We suppose for this tutorial, we have an XML document containing a list of persons.

This document looks like :

<personnel>

     <person id="Alex">

   ...

     </person>

     <person id="Mike">

   ...

     </person>

   </personnel>

We wish to see this list in a browser, so we will transform it creating a new XSLT document following these steps.

Step 1 : Create an XSLT document

We creating a new XSLT document from the File menu and the "New..." item.

step1

The following document is opened :

step 1b

This page contains 3 documents :

The main one with our XSLT document
The XML document to be transformed on the left bottom location
The XHTML / HTML document result on the right bottom location

We save

the current XSLT document in our working directory.

We load our XML document :

step1

The XPath comboBox gives us a way to test our main XPath query we want all persons from the personnel tag

step1

Each XPath response has a red line. We can navigate between each response with the blue icons.

We build then the following XSLT document : This document will show each "id" person.



   <?xml version="1.0" encoding="UTF-8"?>

   

   <xsl:stylesheet version="1.0"

                   
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

                   
 xmlns="http://www.w3.org/TR/xhtml1/strict">

   

   <xsl:output method="html"/>

   

   <xsl:template match="/">

   <html>

     <body>

     <xsl:for-each select="/personnel/*">

     <h2><xsl:value-of select="@id"/>

     </h2>

     </xsl:for-each>

     </body>

   </html>

   </xsl:template>

   </xsl:stylesheet>

Step 2 : Transform it

We transform our document with this toolbar action :

This action showes this dialog box :

step2

We have to choose a result file before transforming. Then we click on the 'Ok'
button.

Step 3 : Look at the transformation result

We select the "HTML 3.2" combo, we can look too at the source.

For repeating this transformation, we invoke the Ctrl - J shortcut or the "Repeat last transformation" from the XSL menu.

Editix tutorial : http://www.editix.com