Programming Course: XML and XSLT Overview

This free online course will give you a fundamental understanding of XML and XSLT, and will teach you how to create XML documents and convert them to HTML using XSLT transformations.

Course Prep:

  1. Read chapter 2, pages 38 - 56, in the J2EE and XML Development textbook from Manning Publishing Co (free chapter).
  2. View the XML and XSLT Overview lecture (also available in pdf format here).

Course Overview:

You'll often encounter systems that need to communicate with each other across the Internet using different operating systems, different computer languages, and different web servers.

XML makes a great neutral communication mechanism because it's just plain old ASCII text that's formatted in a certain format. Any computer language that can read and write text files can work with XML.

There are also times when a hierarchical set of data is requested from a database, and transmitted between systems. XML provides a way to describe hierarchical data in a much more robust manner than comma-delimited formats.

XML describes data but does not normally contain instructions for how the data should be displayed. The display instructions are usually handled by HTML, and XSLT provides a way to convert XML into HTML.

You'll notice that an XSLT document is itself an XML document that provides instructions to an XSLT processor about how to format the resulting HTML. The XSLT processor handles embedding XML data in HTML commands so that a web browser can properly display the data in the desired format.

Internet Explorer and Mozilla both have XSLT engines built in, which means they can perform xml transformations for you. When you create your xml and xslt files, you can include a stylesheet directive in the second line of your xml file (also shown in the powerpoint lecture):

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

This will instruct the browser where to find your stylesheet, and it will display the transformed stylesheet in the browser.

Take a look at the sample xml and xslt files provided below, and open them in Internet Explorer or Notepad to see their contents. You can use them as examples to help you create your own XML and XSLT files. To save them to your computer, right-click each of them and select "Save Target As" from the short-cut menu.

Course Exercises:

  1. Using a text editor of your choice, create the following XML document named accounts.xml that defines a checking account and a savings account. Notepage will do the trick, but you may also use XML Spy or a similar XML editor.

    <?xml version="1.0" encoding="UTF-8"?>
    <?xml-stylesheet type="text/xsl" href="accounts.xslt"?>
    <accounts user="Jeff" password="astro">
        <account id="153603" name=" Checking" balance="2593.41"/>
        <account id="695486" name="Savings" balance="46329.60"/>
    </accounts>

  2. Create an XSLT stylesheet called accounts.xslt that converts the XML above into HTML in the following format:

    <html>
    <body>
    <p>Welcome Jeff,</p>
    <p>Your account information is listed below: </p>
        <table border="0" width="100%">
            <tr><th>Account ID</th><th> Account Name</th><th>Balance</th></tr>
            <tr><td>153603</td><td>Checking</td><td>$2593.41</td></tr>
           
    <tr><td>695486</td><td>Savings</td><td>$46329.60</td></tr>
        </table>
    </body>
    </html>

    Make sure that accounts.xml and accounts.xslt are located in the same folder.

  3. Open accounts.xml with Internet Explorer and verify that the HTML looks like the sample above, using the View -- Source menu once the page has been displayed. The web page displayed in the browser should look like this:

    Welcome Jeff,

    Your account information is listed below:

    Account ID Account Name Balance
    153603 Checking $2593.41
    695486 Savings $46329.60

Help needed with the examples


I can't get the examples (or my own files) to work right. I don't get any errors, but where the [xsl:value-of select="value"] or the [..."@attribute"] all I get are blanks. The rest of the XML follows the XSLT formatting with the hard-coded values. I think my
problem might be with the template, or use-template, but I can't seem to find the right combination.

Thanks,

Mike

Which browser are you using?


Here's some more information about XSLT stylesheets that might be helpful:

Whenever you have an apply-templates element, it needs to specify which template to apply, like this:

<xsl:apply-templates select="//employee" />

The line above tells the xslt processor to look for a template for the employee element, which would look like this:

<xsl:template match="//employee">

The double slashes tell the XSLT processor to look for an employee element anywhere in the document, as opposed to /employees/employee which would indicate to start at the employees element and look for the first employee element. These are called XPath instructions, since they tell the XSLT processor where and how to find a particular xml element.

There's also a similarity here in the way xslt instructions are initiated compared with regular java method calls.

Look at the apply-templates tag as an instruction call to a method, and the template tag as the method that's being called.

The select attribute defines the name of the "method" to look for, and the xslt processor will look for a template tag that has a match attribute that "matches" the select attribute.

Notice how the select and match attributes have the same value (//employees in this case). These attributes act as keys or identifiers, so that the xslt processor knows what to look for, and knows when it's found the correct template tag. Once it's found the correct template tag, then it happily follows the instructions contained in the template tag.

Rick

What does "isi" mean


Hi,
I notice that the xml example in the presentation has an "isi" along with the tag wherease the example in the book doesn't have it. What does isi denote and why is it there in some places and not there in others?

Thanks
Biruntha

"isi" is an xml namespace


ISI was a company I worked for at the time I created that xml snippet.... the "isi" is a namespace that distinguishes an xml element from another that has the same name.

For example, an xml element named employee could be found twice in the same xml document, and the namespace would help differentiate the two in case they needed to be handled differently.

The namespace prefaces the element name, like this:

<isi:employee/>

Rick